@leafygreen-ui/combobox 0.9.0

package/dist/ComboboxTestUtils.d.ts

@@ -0,0 +1,126 @@
+/// <reference types="jest" />
+import React from 'react';
+import { BaseComboboxProps, ComboboxMultiselectProps } from './Combobox.types';
+import { OptionObject } from './util';
+export interface NestedObject {
+    label: string;
+    children: Array<string | OptionObject>;
+}
+export declare type Select = 'single' | 'multiple';
+declare type renderComboboxProps = {
+    options?: Array<string | OptionObject | NestedObject>;
+} & BaseComboboxProps & ComboboxMultiselectProps<boolean>;
+export declare const defaultOptions: Array<OptionObject>;
+export declare const groupedOptions: Array<NestedObject>;
+/**
+ * @param props Combobox props
+ * @returns Combobox JSX
+ */
+export declare const getComboboxJSX: (props?: renderComboboxProps | undefined) => JSX.Element;
+/**
+ * Renders a combobox
+ * @param select `'single' | 'multiple'`
+ * @param props `renderComboboxProps`
+ * @returns Object of combobox elements & utility functions
+ */
+export declare function renderCombobox<T extends Select>(select?: T, props?: renderComboboxProps): {
+    rerenderCombobox: (newProps: renderComboboxProps) => void;
+    queryChipsByName: {
+        (names: string): HTMLElement | null;
+        (names: Array<string>): Array<HTMLElement> | null;
+    };
+    queryChipsByIndex: {
+        (index: number): HTMLElement | null;
+        (index: 'first' | 'last'): HTMLElement | null;
+        (index: Array<number>): Array<HTMLElement> | null;
+    };
+    queryAllChips: () => Array<HTMLElement>;
+    getMenuElements: () => {
+        menuContainerEl: HTMLElement | null;
+        popoverEl: ChildNode | null | undefined;
+        menuEl: HTMLUListElement | undefined;
+        optionElements: HTMLCollectionOf<HTMLLIElement> | undefined;
+        selectedElements: (T extends "single" ? HTMLElement : HTMLElement[]) | null;
+    };
+    openMenu: () => {
+        menuContainerEl: HTMLElement | null;
+        popoverEl: ChildNode | null | undefined;
+        menuEl: HTMLUListElement | undefined;
+        optionElements: HTMLCollectionOf<HTMLLIElement> | undefined;
+        selectedElements: (T extends "single" ? HTMLElement : HTMLElement[]) | null;
+    };
+    containerEl: HTMLElement;
+    labelEl: HTMLLabelElement;
+    comboboxEl: HTMLElement;
+    inputEl: HTMLInputElement;
+    clearButtonEl: HTMLElement | null;
+    container: HTMLElement;
+    baseElement: HTMLElement;
+    debug: (baseElement?: DocumentFragment | HTMLElement | (DocumentFragment | HTMLElement)[] | undefined, maxLength?: number | undefined, options?: import("pretty-format/build/types").OptionsReceived | undefined) => void;
+    rerender: (ui: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) => void;
+    unmount: () => boolean;
+    asFragment: () => DocumentFragment;
+    getByLabelText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement;
+    getAllByLabelText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    queryByLabelText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement | null;
+    queryAllByLabelText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    findByLabelText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    findAllByLabelText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    getByPlaceholderText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement;
+    getAllByPlaceholderText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    queryByPlaceholderText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement | null;
+    queryAllByPlaceholderText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    findByPlaceholderText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    findAllByPlaceholderText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    getByText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement;
+    getAllByText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    queryByText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement | null;
+    queryAllByText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    findByText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    findAllByText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    getByAltText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement;
+    getAllByAltText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    queryByAltText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement | null;
+    queryAllByAltText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    findByAltText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    findAllByAltText: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    getByTitle: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement;
+    getAllByTitle: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    queryByTitle: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement | null;
+    queryAllByTitle: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    findByTitle: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    findAllByTitle: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    getByDisplayValue: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement;
+    getAllByDisplayValue: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    queryByDisplayValue: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement | null;
+    queryAllByDisplayValue: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    findByDisplayValue: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    findAllByDisplayValue: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    getByRole: (text: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: unknown) => HTMLElement;
+    getAllByRole: (text: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    queryByRole: (text: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: unknown) => HTMLElement | null;
+    queryAllByRole: (text: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    findByRole: (text: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    findAllByRole: (text: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    getByTestId: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement;
+    getAllByTestId: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    queryByTestId: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement | null;
+    queryAllByTestId: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: unknown) => HTMLElement[];
+    findByTestId: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    findAllByTestId: (text: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+};
+/**
+ * Conditionally runs a test
+ * @param condition
+ * @returns `test`
+ */
+export declare const testif: (condition: boolean) => jest.It;
+declare global {
+    namespace jest {
+        interface Matchers<R> {
+            toContainFocus(): R;
+        }
+    }
+}
+export {};
+//# sourceMappingURL=ComboboxTestUtils.d.ts.map

package/dist/ComboboxTestUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboboxTestUtils.d.ts","sourceRoot":"","sources":["../src/ComboboxTestUtils.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,OAAO,EAAE,iBAAiB,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAC/E,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAItC,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,KAAK,CAAC,MAAM,GAAG,YAAY,CAAC,CAAC;CACxC;AAED,oBAAY,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;AAC3C,aAAK,mBAAmB,GAAG;IACzB,OAAO,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,YAAY,GAAG,YAAY,CAAC,CAAC;CACvD,GAAG,iBAAiB,GACnB,wBAAwB,CAAC,OAAO,CAAC,CAAC;AAEpC,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,YAAY,CAa9C,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,YAAY,CA2B9C,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,0DAkC1B,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,CAAC,SAAS,MAAM,EAC7C,MAAM,GAAE,CAAiB,EACzB,KAAK,CAAC,EAAE,mBAAmB;iCAsDS,mBAAmB;;gBAmBtB,MAAM,GAAG,WAAW,GAAG,IAAI;gBAC3B,MAAM,MAAM,CAAC,GAAG,MAAM,WAAW,CAAC,GAAG,IAAI;;;gBAgBxC,MAAM,GAAG,WAAW,GAAG,IAAI;gBAC3B,OAAO,GAAG,MAAM,GAAG,WAAW,GAAG,IAAI;gBACrC,MAAM,MAAM,CAAC,GAAG,MAAM,WAAW,CAAC,GAAG,IAAI;;yBAhCjD,MAAM,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiE7C;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,cAAe,OAAO,YAAmC,CAAC;AA8B7E,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,IAAI,CAAC;QACb,UAAU,QAAQ,CAAC,CAAC;YAClB,cAAc,IAAI,CAAC,CAAC;SACrB;KACF;CACF"}

package/dist/esm/index.js

@@ -0,0 +1,2 @@
+import n,{createContext as o,useContext as e,useCallback as r,useMemo as t,useRef as i,useEffect as a,useState as l}from"react";import{kebabCase as c,isArray as u,isNull as s,isString as d,isUndefined as b,clone as g}from"lodash";import{Label as p,Description as m}from"@leafygreen-ui/typography";import f from"@leafygreen-ui/popover";import{useIdAllocator as h,useForwardedRef as v,useDynamicRefs as x,usePrevious as y,useViewportSize as w,useEventListener as k}from"@leafygreen-ui/hooks";import C from"@leafygreen-ui/interaction-ring";import N,{isComponentGlyph as O}from"@leafygreen-ui/icon";import j from"@leafygreen-ui/icon-button";import{css as M,cx as E,keyframes as z}from"@leafygreen-ui/emotion";import{uiColors as I}from"@leafygreen-ui/palette";import{isComponentType as S,keyMap as D,createDataProp as L}from"@leafygreen-ui/lib";import F from"@leafygreen-ui/checkbox";import{jsx as P}from"@emotion/react";import A from"@leafygreen-ui/inline-definition";import{fontFamilies as T}from"@leafygreen-ui/tokens";function R(n,o){var e=Object.keys(n);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(n);o&&(r=r.filter((function(o){return Object.getOwnPropertyDescriptor(n,o).enumerable}))),e.push.apply(e,r)}return e}function W(n){for(var o=1;o<arguments.length;o++){var e=null!=arguments[o]?arguments[o]:{};o%2?R(Object(e),!0).forEach((function(o){B(n,o,e[o])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(e)):R(Object(e)).forEach((function(o){Object.defineProperty(n,o,Object.getOwnPropertyDescriptor(e,o))}))}return n}function B(n,o,e){return o in n?Object.defineProperty(n,o,{value:e,enumerable:!0,configurable:!0,writable:!0}):n[o]=e,n}function G(){return(G=Object.assign||function(n){for(var o=1;o<arguments.length;o++){var e=arguments[o];for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r])}return n}).apply(this,arguments)}function K(n,o){if(null==n)return{};var e,r,t=function(n,o){if(null==n)return{};var e,r,t={},i=Object.keys(n);for(r=0;r<i.length;r++)e=i[r],o.indexOf(e)>=0||(t[e]=n[e]);return t}(n,o);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(n);for(r=0;r<i.length;r++)e=i[r],o.indexOf(e)>=0||Object.prototype.propertyIsEnumerable.call(n,e)&&(t[e]=n[e])}return t}function V(n,o){return o||(o=n.slice(0)),Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(o)}}))}function H(n,o){return function(n){if(Array.isArray(n))return n}(n)||function(n,o){var e=null==n?null:"undefined"!=typeof Symbol&&n[Symbol.iterator]||n["@@iterator"];if(null==e)return;var r,t,i=[],a=!0,l=!1;try{for(e=e.call(n);!(a=(r=e.next()).done)&&(i.push(r.value),!o||i.length!==o);a=!0);}catch(n){l=!0,t=n}finally{try{a||null==e.return||e.return()}finally{if(l)throw t}}return i}(n,o)||X(n,o)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function U(n){return function(n){if(Array.isArray(n))return Y(n)}(n)||function(n){if("undefined"!=typeof Symbol&&null!=n[Symbol.iterator]||null!=n["@@iterator"])return Array.from(n)}(n)||X(n)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function X(n,o){if(n){if("string"==typeof n)return Y(n,o);var e=Object.prototype.toString.call(n).slice(8,-1);return"Object"===e&&n.constructor&&(e=n.constructor.name),"Map"===e||"Set"===e?Array.from(n):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?Y(n,o):void 0}}function Y(n,o){(null==o||o>n.length)&&(o=n.length);for(var e=0,r=new Array(o);e<o;e++)r[e]=n[e];return r}var $,q,J,Q,Z,_,nn,on,en,rn=o({multiselect:!1,darkMode:!1,size:"default",withIcons:!1,disabled:!1}),tn=W(W({},D),{},{Backspace:8,Delete:46}),an=function(o,e,r){if(e&&r){var t=new RegExp(e,"gi"),i=o.search(t),a=i+e.length,l=o.split(""),c=l.slice(0,i).join(""),u=l.slice(a).join(""),s=l.slice(i,a).join(""),d=n.createElement(r,null,s);return P(n.Fragment,null,c,d,u)}return P(n.Fragment,null,o)},ln=function(n){var o,e=n.value,r=n.displayName;return{value:null!=e?e:c(r),displayName:null!==(o=null!=r?r:e)&&void 0!==o?o:""}},cn=function o(e){return n.Children.toArray(e).reduce((function(n,e){if(S(e,"ComboboxOption")){var r=ln(e.props),t=r.value,i=r.displayName,a=e.props.glyph;return[].concat(U(n),[{value:t,displayName:i,hasGlyph:!!a}])}if(S(e,"ComboboxGroup")){var l=e.props.children;if(l)return[].concat(U(n),U(o(l)))}}),[])},un=M(q||(q=V(["\n  display: inline-flex;\n  gap: 8px;\n  justify-content: start;\n  align-items: inherit;\n"]))),sn=function(n){return M(J||(J=V(["\n  font-weight: ",";\n"])),n?"bold":"normal")},dn=n.forwardRef((function(o,i){var a=o.displayName,l=o.glyph,c=o.isSelected,u=o.isFocused,s=o.setSelected,d=o.className,b=e(rn),g=b.multiselect,p=b.darkMode,m=b.withIcons,f=b.inputValue,x=h({prefix:"combobox-option-text"}),y=v(i,null),w=r((function(n){n.stopPropagation(),n.target!==y.current&&"INPUT"!==n.target.tagName||s()}),[y,s]),k=t((function(){if(l){if(O(l)||S(l,"Icon"))return l;console.error("`ComboboxOption` instance did not render icon because it is not a known glyph element.",l)}}),[l]),C=t((function(){if(g){var o=P(F,{label:"","aria-labelledby":x,checked:c,tabIndex:-1,animate:!1});return P(n.Fragment,null,P("span",{className:un},m?k:o,P("span",{id:x,className:sn(c)},an(a,f,"strong"))),m&&o)}return P(n.Fragment,null,P("span",{className:un},k,P("span",{className:sn(c)},an(a,f,"strong"))),c&&P(N,{glyph:"Checkmark",color:p?I.blue.light1:I.blue.base}))}),[g,k,c,a,f,p,x,m]);return P("li",{ref:y,role:"option","aria-selected":u,"aria-label":a,tabIndex:-1,className:E(M($||($=V(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  list-style: none;\n  color: inherit;\n  cursor: pointer;\n  overflow: hidden;\n  font-size: var(--lg-combobox-item-font-size);\n  line-height: var(--lg-combobox-item-line-height);\n  padding: var(--lg-combobox-item-padding-y) var(--lg-combobox-item-padding-x);\n\n  &:before {\n    content: '';\n    position: absolute;\n    left: 0;\n    width: 3px;\n    height: var(--lg-combobox-item-wedge-height);\n    background-color: transparent;\n    border-radius: 0 2px 2px 0;\n    transform: scaleY(0.3);\n    transition: 150ms ease-in-out;\n    transition-property: transform, background-color;\n  }\n\n  &:hover {\n    outline: none;\n    background-color: var(--lg-combobox-item-hover-color);\n  }\n\n  &[aria-selected='true'] {\n    outline: none;\n    background-color: var(--lg-combobox-item-active-color);\n\n    &:before {\n      background-color: var(--lg-combobox-item-wedge-color);\n      transform: scaleY(1);\n    }\n  }\n"]))),d),onClick:w,onKeyPress:w},C)}));function bn(n){throw Error("`ComboboxOption` must be a child of a `Combobox` instance")}dn.displayName="ComboboxOption",bn.displayName="ComboboxOption";var gn,pn,mn,fn,hn,vn,xn,yn,wn,kn,Cn,Nn,On,jn,Mn,En,zn,In,Sn,Dn,Ln,Fn,Pn,An=function(n){var o,e,r=n.darkMode,t=n.size;switch(o=r?M(Q||(Q=V([""]))):M(Z||(Z=V(["\n      --lg-combobox-chip-text-color: ",";\n      --lg-combobox-chip-icon-color: ",";\n      --lg-combobox-chip-background-color: ",";\n      --lg-combobox-chip-hover-color: ",";\n      --lg-combobox-chip-focus-color: ",";\n    "])),I.gray.dark3,I.gray.dark2,I.gray.light2,I.gray.light1,I.blue.light2),t){case"default":e=M(_||(_=V(["\n        --lg-combobox-chip-height: 24px;\n        --lg-combobox-chip-border-radius: 4px;\n        --lg-combobox-chip-font-size: 14px;\n        --lg-combobox-chip-line-height: 20px;\n        --lg-combobox-chip-padding-x: 6px;\n      "])))}return E(o,e,M(nn||(nn=V(["\n      display: inline-flex;\n      align-items: center;\n      overflow: hidden;\n      white-space: nowrap;\n      height: var(--lg-combobox-chip-height);\n      font-size: var(--lg-combobox-chip-font-size);\n      line-height: var(--lg-combobox-chip-line-height);\n      border-radius: var(--lg-combobox-chip-border-radius);\n      color: var(--lg-combobox-chip-text-color);\n      background-color: var(--lg-combobox-chip-background-color);\n\n      // TODO - refine these styles\n      /* &:focus, */\n      &:focus-within {\n        background-color: var(--lg-combobox-chip-focus-color);\n      }\n    "]))))},Tn=M(on||(on=V(["\n  padding-inline: var(--lg-combobox-chip-padding-x);\n"]))),Rn=M(en||(en=V(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n  outline: none;\n  border: none;\n  background-color: transparent;\n  color: var(--lg-combobox-chip-icon-color);\n  cursor: pointer;\n  transition: background-color 100ms ease-in-out;\n\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 1px;\n    background-color: var(--lg-combobox-chip-hover-color);\n  }\n\n  &:hover {\n    background-color: var(--lg-combobox-chip-hover-color);\n  }\n"]))),Wn=n.forwardRef((function(n,o){var r=n.displayName,l=n.isFocused,c=n.onRemove,u=n.onFocus,s=e(rn),d=s.darkMode,b=s.size,g=s.disabled,p=s.chipTruncationLocation,m=s.chipCharacterLimit,f=void 0===m?12:m,h=!!f&&!!p&&"none"!==p&&r.length>f,v=i(null),x=t((function(){if(h){var n=f-3;switch(p){case"start":return"…"+r.substring(r.length-n).trim();case"middle":return r.substring(0,n/2).trim()+"…"+r.substring(r.length-n/2).trim();case"end":return r.substring(0,n).trim()+"…";default:return r}}return!1}),[f,p,r,h]);a((function(){var n;l&&!g&&(null==v||null===(n=v.current)||void 0===n||n.focus())}),[g,o,l]);var y=L("combobox-chip");return P("span",G({role:"option","aria-selected":l,"data-test-id":"lg-combobox-chip"},y.prop,{ref:o,className:An({darkMode:d,size:b}),onClick:function(n){var o;null!==(o=v.current)&&void 0!==o&&o.contains(n.target)||u()},tabIndex:-1}),P("span",{className:Tn},x?P(A,{definition:r,align:"bottom"},x):r),P("button",{"aria-label":"Deselect ".concat(r),"aria-disabled":g,disabled:g,ref:v,className:Rn,onClick:function(){g||c()},onKeyDown:function(n){g||n.keyCode!==tn.Delete&&n.keyCode!==tn.Backspace&&n.keyCode!==tn.Enter&&n.keyCode!==tn.Space||c()}},P(N,{glyph:"X"})))}));Wn.displayName="Chip";var Bn,Gn,Kn=function(n){var o=n.darkMode,e=n.size,r=n.overflow;return E(function(n){return n?M(gn||(gn=V([""]))):M(pn||(pn=V(["\n        --lg-combobox-color-error: ",";\n        --lg-combobox-text-color: ",";\n        --lg-combobox-text-color-disabled: ",";\n\n        --lg-combobox-background-color: ",";\n        --lg-combobox-background-color-focus: ",";\n        --lg-combobox-background-color-disabled: ",";\n\n        --lg-combobox-border-color: ",";\n        --lg-combobox-border-color-disabled: ",";\n        --lg-combobox-border-color-error: ",";\n\n        --lg-combobox-shadow: 0px 1px 2px rgba(6, 22, 33, 0.3);\n        --lg-combobox-shadow-focus: 0px 4px 4px rgba(6, 22, 33, 0.3);\n      "])),I.red.base,I.gray.dark3,I.gray.dark1,I.gray.light3,I.white,I.gray.light2,I.gray.base,I.gray.light1,I.red.base)}(o),function(n){switch(n){case"default":return M(mn||(mn=V(["\n          --lg-combobox-padding-y: 5px;\n          --lg-combobox-padding-x: 7px;\n          --lg-combobox-height: 24px;\n          --lg-combobox-font-size: 14px;\n          --lg-combobox-line-height: 20px;\n          --lg-combobox-border-radius: 3px;\n          --lg-combobox-input-default-width: 12ch;\n          --lg-combobox-icon-height: 16px;\n        "])))}}(e),M(fn||(fn=V(["\n      --lg-combobox-width: ",";\n      --lg-combobox-padding: var(--lg-combobox-padding-y)\n        var(--lg-combobox-padding-x) var(--lg-combobox-padding-y)\n        ",";\n      width: var(--lg-combobox-width);\n    "])),"expand-x"===r?"unset":"100%","scroll-x"===r?"0":"var(--lg-combobox-padding-x)"))},Vn=M(hn||(hn=V(["\n  display: flex;\n  flex-wrap: nowrap;\n  align-items: center;\n  padding: var(--lg-combobox-padding);\n  color: var(--lg-combobox-text-color);\n  background-color: var(--lg-combobox-background-color);\n  box-shadow: var(--lg-combobox-shadow);\n  border: 1px solid var(--lg-combobox-border-color);\n  border-radius: var(--lg-combobox-border-radius);\n  width: var(--lg-combobox-width);\n  cursor: text;\n  transition: 150ms ease-in-out;\n  transition-property: background-color, box-shadow;\n  min-width: 256px;\n\n  &:focus-within {\n    background-color: var(--lg-combobox-background-color-focus);\n    box-shadow: var(--lg-combobox-shadow-focus);\n  }\n\n  &[data-disabled='true'] {\n    color: var(--lg-combobox-text-color-disabled);\n    background-color: var(--lg-combobox-background-color-disabled);\n    border-color: var(--lg-combobox-border-color-disabled);\n    box-shadow: unset;\n    cursor: not-allowed;\n  }\n\n  &[data-state='error'] {\n    border-color: var(--lg-combobox-border-color-error);\n  }\n"]))),Hn=M(vn||(vn=V(["\n  width: var(--lg-combobox-width);\n"]))),Un=function(n){var o=n.state;return n.darkMode?{hovered:"error"===o?I.red.dark2:void 0}:{hovered:"error"===o?I.red.light3:void 0}},Xn=function(n){var o,e=n.overflow,r=n.isOpen,t=n.selection,i=n.value,a=u(t)&&t.length>0,l=null!==(o=null==i?void 0:i.length)&&void 0!==o?o:0,c=a?r||l>0?"".concat(l+1,"ch"):"0":"var(--lg-combobox-input-default-width)",s=M(xn||(xn=V(["\n    flex-grow: 1;\n    width: var(--lg-combobox-width);\n\n    --lg-combobox-input-width: ",";\n  "])),c);switch(e){case"scroll-x":return M(yn||(yn=V(["\n        ","\n        display: block;\n        height: var(--lg-combobox-height);\n        white-space: nowrap;\n        overflow-x: scroll;\n        scroll-behavior: smooth;\n        scrollbar-width: none;\n        /*\n         * Immediate transition in, slow transition out. \n         * '-in' transition is handled by `scroll-behavior` \n         */\n        --lg-combobox-input-transition: width ease-in-out\n          ",";\n\n        &::-webkit-scrollbar {\n          display: none;\n        }\n\n        & > * {\n          margin-inline: 2px;\n\n          &:first-child {\n            margin-inline-start: var(--lg-combobox-padding-x);\n          }\n\n          &:last-child {\n            margin-inline-end: var(--lg-combobox-padding-x);\n          }\n        }\n      "],["\n        ","\n        display: block;\n        height: var(--lg-combobox-height);\n        white-space: nowrap;\n        overflow-x: scroll;\n        scroll-behavior: smooth;\n        scrollbar-width: none;\n        /*\n         * Immediate transition in, slow transition out. \n         * '-in' transition is handled by \\`scroll-behavior\\` \n         */\n        --lg-combobox-input-transition: width ease-in-out\n          ",";\n\n        &::-webkit-scrollbar {\n          display: none;\n        }\n\n        & > * {\n          margin-inline: 2px;\n\n          &:first-child {\n            margin-inline-start: var(--lg-combobox-padding-x);\n          }\n\n          &:last-child {\n            margin-inline-end: var(--lg-combobox-padding-x);\n          }\n        }\n      "])),s,r?"0":"100ms");case"expand-x":return M(wn||(wn=V(["\n        ","\n        display: flex;\n        gap: 4px;\n        flex-wrap: nowrap;\n        white-space: nowrap;\n        --lg-combobox-input-transition: width 150ms ease-in-out;\n      "])),s);case"expand-y":return M(kn||(kn=V(["\n        ","\n        display: flex;\n        flex-wrap: wrap;\n        gap: 4px;\n        overflow-x: visible;\n      "])),s)}},Yn=M(Cn||(Cn=V(["\n  border: none;\n  cursor: inherit;\n  background-color: inherit;\n  box-sizing: content-box;\n  padding-block: calc(\n    (var(--lg-combobox-height) - var(--lg-combobox-line-height)) / 2\n  );\n  padding-inline: 0;\n  height: var(--lg-combobox-line-height);\n  width: var(\n    --lg-combobox-input-width,\n    var(--lg-combobox-input-default-width, auto)\n  );\n  transition: var(--lg-combobox-input-transition);\n\n  &:focus {\n    outline: none;\n  }\n"]))),$n=M(Nn||(Nn=V(["\n  // Add a negative margin so the button takes up the same space as the regular icons\n  margin-block: calc(var(--lg-combobox-icon-height) / 2 - 100%);\n"]))),qn=M(On||(On=V(["\n  font-size: var(--lg-combobox-font-size);\n  line-height: var(--lg-combobox-line-height);\n  color: var(--lg-combobox-color-error);\n  padding-top: var(--lg-combobox-padding-y);\n"]))),Jn=M(jn||(jn=V(["\n  margin-inline-end: calc(var(--lg-combobox-padding-x) / 2);\n"]))),Qn=z(Mn||(Mn=V(["\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n"]))),Zn=M(En||(En=V(["\n  animation: "," 1.5s linear infinite;\n"])),Qn),_n=function(n){var o,e,r=n.darkMode,t=n.size,i=n.width,a=void 0===i?384:i;switch(o=r?M(zn||(zn=V([""]))):M(In||(In=V(["\n      --lg-combobox-menu-color: ",";\n      --lg-combobox-menu-message-color: ",";\n      --lg-combobox-menu-background-color: ",";\n      --lg-combobox-menu-shadow: 0px 3px 7px rgba(0, 0, 0, 0.25);\n      --lg-combobox-item-hover-color: ",";\n      --lg-combobox-item-active-color: ",";\n      --lg-combobox-item-wedge-color: ",";\n    "])),I.gray.dark3,I.gray.dark1,I.white,I.gray.light2,I.blue.light3,I.blue.base),t){case"default":e=M(Sn||(Sn=V(["\n        --lg-combobox-menu-border-radius: 4px;\n        --lg-combobox-item-height: 36px;\n        --lg-combobox-item-padding-y: 8px;\n        --lg-combobox-item-padding-x: 12px;\n        --lg-combobox-item-font-size: 14px;\n        --lg-combobox-item-line-height: 21px;\n        --lg-combobox-item-wedge-height: 22px;\n      "])))}return E(o,e,M(Dn||(Dn=V(["\n      width: ","px;\n      border-radius: var(--lg-combobox-menu-border-radius);\n\n      & > * {\n        border-radius: inherit;\n      }\n    "])),a))},no=function(n){var o=n.maxHeight;return M(Ln||(Ln=V(["\n  position: relative;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  font-family: ",";\n  color: var(--lg-combobox-menu-color);\n  background-color: var(--lg-combobox-menu-background-color);\n  box-shadow: var(--lg-combobox-menu-shadow);\n  border-radius: inherit;\n  overflow: auto;\n  min-height: var(--lg-combobox-item-height);\n  max-height: ","px;\n  scroll-behavior: smooth;\n"])),T.default,o)},oo=M(Fn||(Fn=V(["\n  position: relative;\n  margin: 0;\n  padding: 0;\n"]))),eo=M(Pn||(Pn=V(["\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-size: var(--lg-combobox-item-font-size);\n  color: var(--lg-combobox-menu-message-color);\n  padding: var(--lg-combobox-item-padding-y) var(--lg-combobox-item-padding-x);\n\n  & > svg {\n    width: 1em;\n    height: 1em;\n  }\n"]))),ro=function(n){return M(Bn||(Bn=V(["\n  --lg-combobox-group-label-color: ",";\n  --lg-combobox-group-border-color: ",";\n  padding-top: 8px;\n  border-bottom: 1px solid var(--lg-combobox-group-border-color);\n"])),n?I.gray.light1:I.gray.dark1,n?I.gray.dark1:I.gray.light1)},to=M(Gn||(Gn=V(["\n  cursor: default;\n  width: 100%;\n  padding: 0 12px 2px;\n  outline: none;\n  overflow-wrap: anywhere;\n  font-size: 12px;\n  line-height: 16px;\n  font-weight: bold;\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n  color: var(--lg-combobox-group-label-color);\n"])));function io(o){var r=o.label,t=o.className,i=o.children,a=e(rn).darkMode,l=h({prefix:"combobox-group"});return n.Children.count(i)>0?P("div",{className:E(ro(a),t)},P("div",{className:to,id:l},r),P("div",{role:"group","aria-labelledby":l},i)):P(n.Fragment,null)}function ao(n){throw Error("`ComboboxGroup` must be a child of a `Combobox` instance")}ao.displayName="ComboboxGroup";var lo=["children","label","description","placeholder","aria-label","disabled","size","darkMode","state","errorMessage","searchState","searchEmptyMessage","searchErrorMessage","searchLoadingMessage","filteredOptions","onFilter","clearable","onClear","overflow","multiselect","initialValue","onChange","value","chipTruncationLocation","chipCharacterLimit","className"];function co(o){var e=o.children,c=o.label,v=o.description,O=o.placeholder,M=void 0===O?"Select":O,z=o["aria-label"],D=o.disabled,L=void 0!==D&&D,F=o.size,A=void 0===F?"default":F,T=o.darkMode,R=void 0!==T&&T,W=o.state,B=void 0===W?"none":W,V=o.errorMessage,U=o.searchState,X=void 0===U?"unset":U,Y=o.searchEmptyMessage,$=void 0===Y?"No results found":Y,q=o.searchErrorMessage,J=void 0===q?"Could not get results!":q,Q=o.searchLoadingMessage,Z=void 0===Q?"Loading results...":Q,_=o.filteredOptions,nn=o.onFilter,on=o.clearable,en=void 0===on||on,an=o.onClear,un=o.overflow,sn=void 0===un?"expand-y":un,bn=o.multiselect,gn=void 0!==bn&&bn,pn=o.initialValue,mn=o.onChange,fn=o.value,hn=o.chipTruncationLocation,vn=o.chipCharacterLimit,xn=void 0===vn?12:vn,yn=o.className,wn=K(o,lo),kn=x({prefix:"option"}),Cn=x({prefix:"chip"}),Nn=h({prefix:"combobox-input"}),On=h({prefix:"combobox-label"}),jn=h({prefix:"combobox-menu"}),Mn=i(null),En=i(null),zn=i(null),In=i(null),Sn=i(null),Dn=H(l(!1),2),Ln=Dn[0],Fn=Dn[1],Pn=y(Ln),An=H(l(null),2),Tn=An[0],Rn=An[1],Bn=H(l(null),2),Gn=Bn[0],Qn=Bn[1],ro=y(Gn),to=H(l(""),2),ao=to[0],co=to[1],uo=y(ao),so=H(l(null),2),bo=so[0],go=so[1],po=!s(Gn)&&(u(Gn)&&Gn.length>0||d(Gn)),mo=r((function(n){return gn&&u(n)}),[gn]),fo=r((function(n){!L&&In&&In.current&&(In.current.focus(),b(n)||In.current.setSelectionRange(n,n))}),[L]),ho=r((function(n){if(mo(Gn)){var o=g(Gn);s(n)?o.length=0:Gn.includes(n)?o.splice(o.indexOf(n),1):(o.push(n),co("")),Qn(o),null==mn||mn(o)}else{var e=n;Qn(e),null==mn||mn(e)}}),[mo,mn,Gn]),vo=function(){zn&&zn.current&&(zn.current.scrollLeft=zn.current.scrollWidth)},xo=gn&&u(Gn)&&Gn.length>0?void 0:M,yo=t((function(){return cn(e)}),[e]),wo=r((function(n){var o,e;return n?null!==(o=null===(e=yo.find((function(o){return o.value===n})))||void 0===e?void 0:e.displayName)&&void 0!==o?o:n:""}),[yo]),ko=r((function(n){var o="string"==typeof n?n:n.value;return _&&_.length>0?_.includes(o):("string"==typeof n?wo(o):n.displayName).toLowerCase().includes(ao.toLowerCase())}),[_,wo,ao]),Co=t((function(){return yo.filter(ko)}),[yo,ko]),No=r((function(n){return!!n&&!!yo.find((function(o){return o.value===n}))}),[yo]),Oo=r((function(n){return Co?Co.findIndex((function(o){return o.value===n})):-1}),[Co]),jo=r((function(n){if(Co&&Co.length>=n){var o=Co[n];return o?o.value:void 0}}),[Co]),Mo=r((function(){return mo(Gn)?Gn.findIndex((function(n){var o,e;return null===(o=Cn(n))||void 0===o||null===(e=o.current)||void 0===e?void 0:e.contains(document.activeElement)})):-1}),[Cn,mo,Gn]),Eo=r((function(){var n,o,e,r=null===(n=In.current)||void 0===n?void 0:n.contains(document.activeElement),t=null===(o=En.current)||void 0===o?void 0:o.contains(document.activeElement),i=mo(Gn)&&Gn.some((function(n){var o,e;return null===(o=Cn(n))||void 0===o||null===(e=o.current)||void 0===e?void 0:e.contains(document.activeElement)})),a=function(){return mo(Gn)?Gn.findIndex((function(n){var o,e;return null===(o=Cn(n))||void 0===o||null===(e=o.current)||void 0===e?void 0:e.contains(document.activeElement)})):-1};return mo(Gn)&&i?0===a()?"FirstChip":a()===Gn.length-1?"LastChip":"MiddleChip":r?"Input":t?"ClearButton":null!==(e=Mn.current)&&void 0!==e&&e.contains(document.activeElement)?"Combobox":void 0}),[Cn,mo,Gn]),zo=r((function(n){var o,e=null!==(o=null==Co?void 0:Co.length)&&void 0!==o?o:0,r=e-1>0?e-1:0,t=Oo(Tn);switch(n&&Ln&&(go(null),fo()),n){case"next":var i=jo(t+1<e?t+1:0);Rn(null!=i?i:null);break;case"prev":var a=jo(t-1>=0?t-1:r);Rn(null!=a?a:null);break;case"last":var l=jo(r);Rn(null!=l?l:null);break;case"first":default:var c=jo(0);Rn(null!=c?c:null)}}),[Tn,Oo,jo,Ln,fo,null==Co?void 0:Co.length]),Io=r((function(n,o){if(mo(Gn))switch(n){case"next":var e=null!=o?o:Mo(),r=e+1<Gn.length?e+1:Gn.length-1,t=Gn[r];go(t);break;case"prev":var i=null!=o?o:Mo(),a=i>0?i-1:i<0?Gn.length-1:0,l=Gn[a];go(l);break;case"first":var c=Gn[0];go(c);break;case"last":var u=Gn[Gn.length-1];go(u);break;default:go(null)}}),[Mo,mo,Gn]),So=r((function(n,o){n&&Rn(null);var e=Eo();switch(n){case"right":switch(e){case"Input":var r,t,i;if((null===(r=In.current)||void 0===r?void 0:r.selectionEnd)===(null===(t=In.current)||void 0===t?void 0:t.value.length))null===(i=En.current)||void 0===i||i.focus();break;case"LastChip":o.preventDefault(),fo(0),Io(null);break;case"FirstChip":case"MiddleChip":Io("next")}break;case"left":switch(e){case"ClearButton":var a;o.preventDefault(),fo(null==In||null===(a=In.current)||void 0===a?void 0:a.value.length);break;case"Input":case"MiddleChip":case"LastChip":if(mo(Gn)){var l;if("Input"===e&&0!==(null===(l=In.current)||void 0===l?void 0:l.selectionStart))break;Io("prev")}}break;default:Io(null)}}),[Eo,mo,Gn,fo,Io]);a((function(){ao!==uo&&zo("first")}),[ao,Ln,uo,zo]),a((function(){if(Tn){var n=kn(Tn);if(n&&n.current&&Sn.current){var o=n.current.offsetTop,e=Sn.current,r=e.scrollTop;(o>e.offsetHeight||o<r)&&(Sn.current.scrollTop=o)}}}),[Tn,kn]);var Do=r((function(o){return n.Children.map(o,(function(n){if(S(n,"ComboboxOption")){var o=ln(n.props),e=o.value,r=o.displayName;if(ko(e)){var t=n.props,i=t.className,a=t.glyph,l=yo.findIndex((function(n){return n.value===e})),c=Tn===e,u=mo(Gn)?Gn.includes(e):Gn===e,s=kn(e);return P(dn,{value:e,displayName:r,isFocused:c,isSelected:u,setSelected:function(){Rn(e),ho(e),fo(),e===Gn&&Wo()},glyph:a,className:i,index:l,ref:s})}}else if(S(n,"ComboboxGroup")){var d=Do(n.props.children);if(d&&(null==d?void 0:d.length)>0)return P(io,{label:n.props.label,className:n.props.className},Do(d))}}))}),[yo,Tn,kn,mo,ko,Gn,fo,ho]),Lo=t((function(){return Do(e)}),[e,Do]),Fo=t((function(){if(mo(Gn))return Gn.filter(No).map((function(n,o){var e=wo(n),r=bo===n,t=Cn(n);return P(Wn,{key:n,displayName:e,isFocused:r,onRemove:function(){Io("next",o),ho(n)},onFocus:function(){go(n)},ref:t})}))}),[mo,Gn,No,wo,bo,Cn,Io,ho]),Po=t((function(){return P(n.Fragment,null,en&&po&&P(j,{"aria-label":"Clear selection","aria-disabled":L,disabled:L,ref:En,onClick:function(n){L||(ho(null),null==an||an(n),null==nn||nn(""),Ln||Bo())},onFocus:Yo,className:$n},P(N,{glyph:"XWithCircle"})),P(N,"error"===B?{glyph:"Warning",color:I.red.base,className:Jn}:{glyph:"CaretDown",className:Jn}))}),[en,po,L,B,ho,an,nn,Ln]),Ao=t((function(){return yo.some((function(n){return n.hasGlyph}))}),[yo]),To=r((function(){if(!mo(Gn)&&Gn===ro){var n=Co.find((function(n){return n.displayName===ao||n.value===ao}));if(n&&!fn)Qn(n.value);else{var o,e=null!==(o=wo(Gn))&&void 0!==o?o:"";co(e)}}}),[wo,ao,mo,ro,Gn,fn,Co]),Ro=r((function(){if(po){if(mo(Gn))vo();else if(!mo(Gn)){var n,o=null!==(n=wo(Gn))&&void 0!==n?n:"";co(o),Wo()}}else co("")}),[po,wo,mo,Gn]);a((function(){if(pn)if(u(pn)){var n,o=null!==(n=pn.filter((function(n){return No(n)})))&&void 0!==n?n:[];Qn(o)}else No(pn)&&Qn(pn);else Qn(function(n){return n?[]:null}(gn))}),[]),a((function(){if(!b(fn)&&fn!==uo)if(s(fn))Qn(null);else if(mo(fn)){var n=fn.filter(No);Qn(n)}else Qn(No(fn)?fn:null)}),[mo,No,uo,fn]),a((function(){Gn!==ro&&Ro()}),[Ro,ro,Gn]),a((function(){Ln||Pn===Ln||To()}),[Ln,Pn,To]);var Wo=function(){return Fn(!1)},Bo=function(){return Fn(!0)},Go=H(l(0),2),Ko=Go[0],Vo=Go[1];a((function(){var n,o;Vo(null!==(n=null===(o=Mn.current)||void 0===o?void 0:o.clientWidth)&&void 0!==n?n:0)}),[Mn,Ln,Tn,Gn]);var Ho=t((function(){switch(X){case"loading":return P("span",{className:eo},P(N,{glyph:"Refresh",color:I.blue.base,className:Zn}),Z);case"error":return P("span",{className:eo},P(N,{glyph:"Warning",color:I.red.base}),J);case"unset":default:return Lo&&Lo.length>0?P("ul",{className:oo},Lo):P("span",{className:eo},$)}}),[Lo,$,J,Z,X]),Uo=w(),Xo=t((function(){if(Uo&&Mn.current&&Sn.current){var n=Mn.current.getBoundingClientRect(),o=n.top,e=n.bottom,r=Math.max(Uo.height-e,o);return Math.min(274,r-8)}return 274}),[Uo,Mn,Sn]);a((function(){}),[Tn]);var Yo=function(){Rn(null)};return k("mousedown",(function(n){var o,e,r=n.target;(null===(o=Sn.current)||void 0===o?void 0:o.contains(r))||(null===(e=Mn.current)||void 0===e?void 0:e.contains(r))||!1||Fn(!1)})),P(rn.Provider,{value:{multiselect:gn,darkMode:R,size:A,withIcons:Ao,disabled:L,chipTruncationLocation:hn,chipCharacterLimit:xn,inputValue:ao}},P("div",G({className:E(Kn({darkMode:R,size:A,overflow:sn}),yn)},wn),P("div",null,c&&P(p,{id:On,htmlFor:Nn},c),v&&P(m,null,v)),P(C,{className:Hn,disabled:L,color:Un({state:B,darkMode:R})},P("div",{ref:Mn,role:"combobox","aria-expanded":Ln,"aria-controls":jn,"aria-owns":jn,tabIndex:-1,className:Vn,onMouseDown:function(n){n.target!==In.current&&n.preventDefault()},onClick:function(n){if(n.target!==In.current){var o=0;if(In.current)o=n.nativeEvent.offsetX>In.current.offsetLeft+In.current.clientWidth?ao.length:0;fo(o)}},onFocus:function(){vo(),Bo()},onKeyDown:function(n){var o,e,r=null===(o=Sn.current)||void 0===o?void 0:o.contains(document.activeElement);if((null===(e=Mn.current)||void 0===e?void 0:e.contains(document.activeElement))||r){if(n.ctrlKey||n.shiftKey||n.altKey)return;var t=Eo();switch(n.keyCode){case tn.Tab:switch(t){case"Input":po||(Wo(),zo("first"),Io(null));break;case"LastChip":Io(null)}break;case tn.Escape:Wo(),zo("first");break;case tn.Enter:case tn.Space:Ln&&n.preventDefault(),document.activeElement===In.current&&Ln&&!s(Tn)?ho(Tn):document.activeElement===En.current&&(ho(null),fo());break;case tn.Backspace:var i;mo(Gn)&&0===(null===(i=In.current)||void 0===i?void 0:i.selectionStart)?Io("last"):Bo();break;case tn.ArrowDown:Ln&&n.preventDefault(),Bo(),zo("next");break;case tn.ArrowUp:Ln&&n.preventDefault(),zo("prev");break;case tn.ArrowRight:So("right",n);break;case tn.ArrowLeft:So("left",n);break;default:Ln||Bo()}}},onTransitionEnd:function(){var n,o;Vo(null!==(n=null===(o=Mn.current)||void 0===o?void 0:o.clientWidth)&&void 0!==n?n:0)},"data-disabled":L,"data-state":B},P("div",{ref:zn,className:Xn({overflow:sn,isOpen:Ln,selection:Gn,value:ao})},Fo,P("input",{"aria-label":null!=z?z:c,"aria-autocomplete":"list","aria-controls":jn,"aria-labelledby":On,ref:In,id:Nn,className:Yn,placeholder:xo,disabled:null!=L?L:void 0,onChange:function(n){var o=n.target.value;co(o),null==nn||nn(o)},value:ao,autoComplete:"off"})),Po)),"error"===B&&V&&P("div",{className:qn},V),P(f,{active:Ln&&!L,spacing:4,align:"bottom",justify:"middle",refEl:Mn,adjustOnMutation:!0,className:_n({darkMode:R,size:A,width:Ko})},P("div",{id:jn,role:"listbox","aria-labelledby":On,"aria-expanded":Ln,ref:Sn,className:no({maxHeight:Xo}),onMouseDownCapture:function(n){return n.preventDefault()}},Ho))))}export{co as Combobox,ao as ComboboxGroup,bn as ComboboxOption};
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/ComboboxContext.tsx","../../src/ComboboxOption.tsx","../../src/Chip.tsx","../../src/util.tsx","../../src/Combobox.styles.ts","../../src/ComboboxGroup.tsx","../../src/Combobox.tsx","../../src/Combobox.types.ts"],"sourcesContent":["import { createContext } from 'react';\nimport { ComboboxSize, TrunctationLocation } from './Combobox.types';\n\ninterface ComboboxData {\n  multiselect: boolean;\n  darkMode: boolean;\n  size: keyof typeof ComboboxSize;\n  withIcons: boolean;\n  disabled: boolean;\n  chipTruncationLocation?: TrunctationLocation;\n  chipCharacterLimit?: number;\n  inputValue?: string;\n}\n\nexport const ComboboxContext = createContext<ComboboxData>({\n  multiselect: false,\n  darkMode: false,\n  size: 'default',\n  withIcons: false,\n  disabled: false,\n});\n","import { css, cx } from '@leafygreen-ui/emotion';\nimport React, { useCallback, useContext, useMemo } from 'react';\nimport { uiColors } from '@leafygreen-ui/palette';\nimport { isComponentType } from '@leafygreen-ui/lib';\nimport { useForwardedRef, useIdAllocator } from '@leafygreen-ui/hooks';\nimport Checkbox from '@leafygreen-ui/checkbox';\nimport Icon, { isComponentGlyph } from '@leafygreen-ui/icon';\nimport {\n  ComboboxOptionProps,\n  InternalComboboxOptionProps,\n} from './Combobox.types';\nimport { ComboboxContext } from './ComboboxContext';\nimport { wrapJSX } from './util';\n\n/**\n * Styles\n */\n\nconst comboboxOptionStyle = () => css`\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  list-style: none;\n  color: inherit;\n  cursor: pointer;\n  overflow: hidden;\n  font-size: var(--lg-combobox-item-font-size);\n  line-height: var(--lg-combobox-item-line-height);\n  padding: var(--lg-combobox-item-padding-y) var(--lg-combobox-item-padding-x);\n\n  &:before {\n    content: '';\n    position: absolute;\n    left: 0;\n    width: 3px;\n    height: var(--lg-combobox-item-wedge-height);\n    background-color: transparent;\n    border-radius: 0 2px 2px 0;\n    transform: scaleY(0.3);\n    transition: 150ms ease-in-out;\n    transition-property: transform, background-color;\n  }\n\n  &:hover {\n    outline: none;\n    background-color: var(--lg-combobox-item-hover-color);\n  }\n\n  &[aria-selected='true'] {\n    outline: none;\n    background-color: var(--lg-combobox-item-active-color);\n\n    &:before {\n      background-color: var(--lg-combobox-item-wedge-color);\n      transform: scaleY(1);\n    }\n  }\n`;\n\nconst flexSpan = css`\n  display: inline-flex;\n  gap: 8px;\n  justify-content: start;\n  align-items: inherit;\n`;\n\nconst displayNameStyle = (isSelected: boolean) => css`\n  font-weight: ${isSelected ? 'bold' : 'normal'};\n`;\n/**\n * Component\n */\n\nconst InternalComboboxOption = React.forwardRef<\n  HTMLLIElement,\n  InternalComboboxOptionProps\n>(\n  (\n    {\n      displayName,\n      glyph,\n      isSelected,\n      isFocused,\n      setSelected,\n      className,\n    }: InternalComboboxOptionProps,\n    forwardedRef,\n  ) => {\n    const { multiselect, darkMode, withIcons, inputValue } = useContext(\n      ComboboxContext,\n    );\n    const optionTextId = useIdAllocator({ prefix: 'combobox-option-text' });\n    const optionRef = useForwardedRef(forwardedRef, null);\n\n    const handleOptionClick = useCallback(\n      (e: React.SyntheticEvent) => {\n        e.stopPropagation();\n        // If user clicked on the option, or the checkbox\n        // Ignore extra click events on the checkbox wrapper\n        if (\n          e.target === optionRef.current ||\n          (e.target as Element).tagName === 'INPUT'\n        ) {\n          setSelected();\n        }\n      },\n      [optionRef, setSelected],\n    );\n\n    const renderedIcon = useMemo(() => {\n      if (glyph) {\n        if (isComponentGlyph(glyph) || isComponentType(glyph, 'Icon')) {\n          return glyph;\n        }\n        console.error(\n          '`ComboboxOption` instance did not render icon because it is not a known glyph element.',\n          glyph,\n        );\n      }\n    }, [glyph]);\n\n    const renderedChildren = useMemo(() => {\n      // Multiselect\n      if (multiselect) {\n        const checkbox = (\n          <Checkbox\n            // Using empty label due to this bug: https://jira.mongodb.org/browse/PD-1681\n            label=\"\"\n            aria-labelledby={optionTextId}\n            checked={isSelected}\n            tabIndex={-1}\n            animate={false}\n          />\n        );\n\n        return (\n          <>\n            <span className={flexSpan}>\n              {withIcons ? renderedIcon : checkbox}\n              <span id={optionTextId} className={displayNameStyle(isSelected)}>\n                {wrapJSX(displayName, inputValue, 'strong')}\n              </span>\n            </span>\n            {withIcons && checkbox}\n          </>\n        );\n      }\n\n      // Single select\n      return (\n        <>\n          <span className={flexSpan}>\n            {renderedIcon}\n            <span className={displayNameStyle(isSelected)}>\n              {wrapJSX(displayName, inputValue, 'strong')}\n            </span>\n          </span>\n          {isSelected && (\n            <Icon\n              glyph=\"Checkmark\"\n              color={darkMode ? uiColors.blue.light1 : uiColors.blue.base}\n            />\n          )}\n        </>\n      );\n    }, [\n      multiselect,\n      renderedIcon,\n      isSelected,\n      displayName,\n      inputValue,\n      darkMode,\n      optionTextId,\n      withIcons,\n    ]);\n\n    return (\n      <li\n        ref={optionRef}\n        role=\"option\"\n        aria-selected={isFocused}\n        aria-label={displayName}\n        tabIndex={-1}\n        className={cx(comboboxOptionStyle(), className)}\n        onClick={handleOptionClick}\n        onKeyPress={handleOptionClick}\n      >\n        {renderedChildren}\n      </li>\n    );\n  },\n);\nInternalComboboxOption.displayName = 'ComboboxOption';\n\nexport { InternalComboboxOption };\nexport default function ComboboxOption(_: ComboboxOptionProps): JSX.Element {\n  throw Error('`ComboboxOption` must be a child of a `Combobox` instance');\n}\nComboboxOption.displayName = 'ComboboxOption';\n","import React, { useContext, useEffect, useMemo, useRef } from 'react';\nimport { ChipProps, ComboboxSize } from './Combobox.types';\nimport Icon from '@leafygreen-ui/icon';\nimport { ComboboxContext } from './ComboboxContext';\nimport { css, cx } from '@leafygreen-ui/emotion';\nimport { uiColors } from '@leafygreen-ui/palette';\nimport InlineDefinition from '@leafygreen-ui/inline-definition';\nimport { createDataProp } from '@leafygreen-ui/lib';\nimport { keyMap } from './util';\n\nconst chipWrapperStyle = ({\n  darkMode,\n  size,\n}: {\n  darkMode: boolean;\n  size: ComboboxSize;\n}) => {\n  let chipModeStyle, chipSizeStyle;\n\n  if (darkMode) {\n    chipModeStyle = css``;\n  } else {\n    chipModeStyle = css`\n      --lg-combobox-chip-text-color: ${uiColors.gray.dark3};\n      --lg-combobox-chip-icon-color: ${uiColors.gray.dark2};\n      --lg-combobox-chip-background-color: ${uiColors.gray.light2};\n      --lg-combobox-chip-hover-color: ${uiColors.gray.light1};\n      --lg-combobox-chip-focus-color: ${uiColors.blue.light2};\n    `;\n  }\n\n  switch (size) {\n    case 'default':\n      chipSizeStyle = css`\n        --lg-combobox-chip-height: 24px;\n        --lg-combobox-chip-border-radius: 4px;\n        --lg-combobox-chip-font-size: 14px;\n        --lg-combobox-chip-line-height: 20px;\n        --lg-combobox-chip-padding-x: 6px;\n      `;\n      break;\n  }\n\n  return cx(\n    chipModeStyle,\n    chipSizeStyle,\n    css`\n      display: inline-flex;\n      align-items: center;\n      overflow: hidden;\n      white-space: nowrap;\n      height: var(--lg-combobox-chip-height);\n      font-size: var(--lg-combobox-chip-font-size);\n      line-height: var(--lg-combobox-chip-line-height);\n      border-radius: var(--lg-combobox-chip-border-radius);\n      color: var(--lg-combobox-chip-text-color);\n      background-color: var(--lg-combobox-chip-background-color);\n\n      // TODO - refine these styles\n      /* &:focus, */\n      &:focus-within {\n        background-color: var(--lg-combobox-chip-focus-color);\n      }\n    `,\n  );\n};\n\nconst chipText = css`\n  padding-inline: var(--lg-combobox-chip-padding-x);\n`;\n\nconst chipButton = css`\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n  outline: none;\n  border: none;\n  background-color: transparent;\n  color: var(--lg-combobox-chip-icon-color);\n  cursor: pointer;\n  transition: background-color 100ms ease-in-out;\n\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 1px;\n    background-color: var(--lg-combobox-chip-hover-color);\n  }\n\n  &:hover {\n    background-color: var(--lg-combobox-chip-hover-color);\n  }\n`;\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipProps>(\n  ({ displayName, isFocused, onRemove, onFocus }: ChipProps, forwardedRef) => {\n    const {\n      darkMode,\n      size,\n      disabled,\n      chipTruncationLocation,\n      chipCharacterLimit = 12,\n    } = useContext(ComboboxContext);\n\n    const isTruncated =\n      !!chipCharacterLimit &&\n      !!chipTruncationLocation &&\n      chipTruncationLocation !== 'none' &&\n      displayName.length > chipCharacterLimit;\n\n    const buttonRef = useRef<HTMLButtonElement>(null);\n\n    const truncatedName = useMemo(() => {\n      if (isTruncated) {\n        const ellipsis = '…';\n        const chars = chipCharacterLimit - 3; // ellipsis dots included in the char limit\n\n        switch (chipTruncationLocation) {\n          case 'start': {\n            const end = displayName\n              .substring(displayName.length - chars)\n              .trim();\n            return ellipsis + end;\n          }\n\n          case 'middle': {\n            const start = displayName.substring(0, chars / 2).trim();\n            const end = displayName\n              .substring(displayName.length - chars / 2)\n              .trim();\n            return start + ellipsis + end;\n          }\n\n          case 'end': {\n            const start = displayName.substring(0, chars).trim();\n            return start + ellipsis;\n          }\n\n          default: {\n            return displayName;\n          }\n        }\n      }\n\n      return false;\n    }, [chipCharacterLimit, chipTruncationLocation, displayName, isTruncated]);\n\n    useEffect(() => {\n      if (isFocused && !disabled) {\n        buttonRef?.current?.focus();\n      }\n    }, [disabled, forwardedRef, isFocused]);\n\n    const handleKeyDown = (e: React.KeyboardEvent) => {\n      if (\n        !disabled &&\n        (e.keyCode === keyMap.Delete ||\n          e.keyCode === keyMap.Backspace ||\n          e.keyCode === keyMap.Enter ||\n          e.keyCode === keyMap.Space)\n      ) {\n        onRemove();\n      }\n    };\n\n    const handleChipClick = (e: React.MouseEvent) => {\n      // Did not click button\n      if (!buttonRef.current?.contains(e.target as Node)) {\n        onFocus();\n      }\n    };\n\n    const handleButtonClick = () => {\n      if (!disabled) {\n        onRemove();\n      }\n    };\n\n    const dataProp = createDataProp('combobox-chip');\n\n    return (\n      // eslint-disable-next-line jsx-a11y/click-events-have-key-events\n      <span\n        role=\"option\"\n        aria-selected={isFocused}\n        data-test-id=\"lg-combobox-chip\"\n        {...dataProp.prop}\n        ref={forwardedRef}\n        className={chipWrapperStyle({ darkMode, size })}\n        onClick={handleChipClick}\n        tabIndex={-1}\n      >\n        <span className={chipText}>\n          {truncatedName ? (\n            <InlineDefinition definition={displayName} align=\"bottom\">\n              {truncatedName}\n            </InlineDefinition>\n          ) : (\n            displayName\n          )}\n        </span>\n        <button\n          aria-label={`Deselect ${displayName}`}\n          aria-disabled={disabled}\n          disabled={disabled}\n          ref={buttonRef}\n          className={chipButton}\n          onClick={handleButtonClick}\n          onKeyDown={handleKeyDown}\n        >\n          <Icon glyph=\"X\" />\n        </button>\n      </span>\n    );\n  },\n);\nChip.displayName = 'Chip';\n","import { isComponentType, keyMap as _keyMap } from '@leafygreen-ui/lib';\nimport { kebabCase } from 'lodash';\nimport React from 'react';\nimport { ComboboxOptionProps } from './Combobox.types';\n\n// TODO - remove this when lib/keyMap supports Backspace & Delete\nexport const keyMap = {\n  ..._keyMap,\n  Backspace: 8,\n  Delete: 46,\n} as const;\n\n/**\n *\n * Wraps the first instance of `wrap` found in `str` within the provided `element`.\n *\n * E.g. `wrapJSX('Apple', 'ap', 'em') => <><em>Ap</em>ple</>`\n *\n * @param str\n * @param wrap\n * @param element\n * @returns `JSX.Element`\n */\nexport const wrapJSX = (\n  str: string,\n  wrap?: string,\n  element?: string,\n): JSX.Element => {\n  if (wrap && element) {\n    const regex = new RegExp(wrap, 'gi');\n    const startIndex = str.search(regex);\n    const endIndex = startIndex + wrap.length;\n    const nameArr = str.split('');\n    const start = nameArr.slice(0, startIndex).join('');\n    const end = nameArr.slice(endIndex).join('');\n    const match = nameArr.slice(startIndex, endIndex).join('');\n    const matchEl = React.createElement(element, null, match);\n    return (\n      <>\n        {start}\n        {matchEl}\n        {end}\n      </>\n    );\n  }\n\n  return <>{str}</>;\n};\n\n/**\n *\n * Returns an object with properties `value` & `displayName`\n * based on the props provided\n *\n * @property value: string\n * @property displayName: string\n */\nexport const getNameAndValue = ({\n  value: valProp,\n  displayName: nameProp,\n}: ComboboxOptionProps): {\n  value: string;\n  displayName: string;\n} => {\n  return {\n    value: valProp ?? kebabCase(nameProp),\n    displayName: nameProp ?? valProp ?? '', // TODO consider adding a prop to customize displayName => startCase(valProp),\n  };\n};\n\nexport interface OptionObject {\n  value: string;\n  displayName: string;\n  hasGlyph?: boolean;\n}\n\n/**\n *\n * Flattens multiple nested ComboboxOptions into a 1D array\n *\n * @param _children\n * @returns `Array<OptionObject>`\n */\nexport const flattenChildren = (\n  _children: React.ReactNode,\n): Array<OptionObject> => {\n  // TS doesn't like .reduce\n  // @ts-expect-error\n  return React.Children.toArray(_children).reduce(\n    // @ts-expect-error\n    (\n      acc: Array<OptionObject>,\n      child: React.ReactNode,\n    ): Array<OptionObject> | undefined => {\n      if (isComponentType(child, 'ComboboxOption')) {\n        const { value, displayName } = getNameAndValue(child.props);\n        const { glyph } = child.props;\n\n        return [\n          ...acc,\n          {\n            value,\n            displayName,\n            hasGlyph: !!glyph,\n          },\n        ];\n      } else if (isComponentType(child, 'ComboboxGroup')) {\n        const { children } = child.props;\n\n        if (children) {\n          return [...acc, ...flattenChildren(children)];\n        }\n      }\n    },\n    [] as Array<OptionObject>,\n  );\n};\n","/**\n * Styles\n */\n\nimport { css, cx, keyframes } from '@leafygreen-ui/emotion';\nimport { uiColors } from '@leafygreen-ui/palette';\nimport { fontFamilies } from '@leafygreen-ui/tokens';\nimport { isArray } from 'lodash';\nimport { ComboboxSize, Overflow, State } from './Combobox.types';\n\nexport const comboboxParentStyle = ({\n  darkMode,\n  size,\n  overflow,\n}: {\n  darkMode: boolean;\n  size: ComboboxSize;\n  overflow: Overflow;\n}) => {\n  const modeStyle = (darkMode: boolean) => {\n    if (darkMode) {\n      return css``;\n    } else {\n      return css`\n        --lg-combobox-color-error: ${uiColors.red.base};\n        --lg-combobox-text-color: ${uiColors.gray.dark3};\n        --lg-combobox-text-color-disabled: ${uiColors.gray.dark1};\n\n        --lg-combobox-background-color: ${uiColors.gray.light3};\n        --lg-combobox-background-color-focus: ${uiColors.white};\n        --lg-combobox-background-color-disabled: ${uiColors.gray.light2};\n\n        --lg-combobox-border-color: ${uiColors.gray.base};\n        --lg-combobox-border-color-disabled: ${uiColors.gray.light1};\n        --lg-combobox-border-color-error: ${uiColors.red.base};\n\n        --lg-combobox-shadow: 0px 1px 2px rgba(6, 22, 33, 0.3);\n        --lg-combobox-shadow-focus: 0px 4px 4px rgba(6, 22, 33, 0.3);\n      `;\n    }\n  };\n\n  const sizeStyle = (size: ComboboxSize) => {\n    switch (size) {\n      case 'default':\n        return css`\n          --lg-combobox-padding-y: 5px;\n          --lg-combobox-padding-x: 7px;\n          --lg-combobox-height: 24px;\n          --lg-combobox-font-size: 14px;\n          --lg-combobox-line-height: 20px;\n          --lg-combobox-border-radius: 3px;\n          --lg-combobox-input-default-width: 12ch;\n          --lg-combobox-icon-height: 16px;\n        `;\n    }\n  };\n\n  return cx(\n    modeStyle(darkMode),\n    sizeStyle(size),\n    css`\n      --lg-combobox-width: ${overflow === 'expand-x' ? 'unset' : '100%'};\n      --lg-combobox-padding: var(--lg-combobox-padding-y)\n        var(--lg-combobox-padding-x) var(--lg-combobox-padding-y)\n        ${overflow === 'scroll-x' ? '0' : 'var(--lg-combobox-padding-x)'};\n      width: var(--lg-combobox-width);\n    `,\n  );\n};\n\nexport const comboboxStyle = css`\n  display: flex;\n  flex-wrap: nowrap;\n  align-items: center;\n  padding: var(--lg-combobox-padding);\n  color: var(--lg-combobox-text-color);\n  background-color: var(--lg-combobox-background-color);\n  box-shadow: var(--lg-combobox-shadow);\n  border: 1px solid var(--lg-combobox-border-color);\n  border-radius: var(--lg-combobox-border-radius);\n  width: var(--lg-combobox-width);\n  cursor: text;\n  transition: 150ms ease-in-out;\n  transition-property: background-color, box-shadow;\n  min-width: 256px;\n\n  &:focus-within {\n    background-color: var(--lg-combobox-background-color-focus);\n    box-shadow: var(--lg-combobox-shadow-focus);\n  }\n\n  &[data-disabled='true'] {\n    color: var(--lg-combobox-text-color-disabled);\n    background-color: var(--lg-combobox-background-color-disabled);\n    border-color: var(--lg-combobox-border-color-disabled);\n    box-shadow: unset;\n    cursor: not-allowed;\n  }\n\n  &[data-state='error'] {\n    border-color: var(--lg-combobox-border-color-error);\n  }\n`;\n\nexport const interactionRingStyle = css`\n  width: var(--lg-combobox-width);\n`;\n\nexport const interactionRingColor = ({\n  state,\n  darkMode,\n}: {\n  state: State;\n  darkMode: boolean;\n}) => {\n  if (darkMode) {\n    return {\n      hovered: state === 'error' ? uiColors.red.dark2 : undefined,\n    };\n  } else {\n    return {\n      hovered: state === 'error' ? uiColors.red.light3 : undefined,\n    };\n  }\n};\n\nexport const inputWrapperStyle = ({\n  overflow,\n  isOpen,\n  selection,\n  value,\n}: {\n  overflow: Overflow;\n  isOpen: boolean;\n  selection: string | Array<string> | null;\n  value?: string;\n}) => {\n  const isMultiselect = isArray(selection) && selection.length > 0;\n  const inputLength = value?.length ?? 0;\n\n  // The input should be hidden when there are elements selected in a multiselect\n  // We don't set \\`display: none\\` since we need to be able to set .focus() on the element\n  const inputWidth = isMultiselect\n    ? isOpen || inputLength > 0\n      ? `${inputLength + 1}ch`\n      : '0'\n    : 'var(--lg-combobox-input-default-width)';\n\n  const baseWrapperStyle = css`\n    flex-grow: 1;\n    width: var(--lg-combobox-width);\n\n    --lg-combobox-input-width: ${inputWidth};\n  `;\n\n  switch (overflow) {\n    case 'scroll-x': {\n      return css`\n        ${baseWrapperStyle}\n        display: block;\n        height: var(--lg-combobox-height);\n        white-space: nowrap;\n        overflow-x: scroll;\n        scroll-behavior: smooth;\n        scrollbar-width: none;\n        /*\n         * Immediate transition in, slow transition out. \n         * '-in' transition is handled by \\`scroll-behavior\\` \n         */\n        --lg-combobox-input-transition: width ease-in-out\n          ${isOpen ? '0' : '100ms'};\n\n        &::-webkit-scrollbar {\n          display: none;\n        }\n\n        & > * {\n          margin-inline: 2px;\n\n          &:first-child {\n            margin-inline-start: var(--lg-combobox-padding-x);\n          }\n\n          &:last-child {\n            margin-inline-end: var(--lg-combobox-padding-x);\n          }\n        }\n      `;\n    }\n\n    case 'expand-x': {\n      return css`\n        ${baseWrapperStyle}\n        display: flex;\n        gap: 4px;\n        flex-wrap: nowrap;\n        white-space: nowrap;\n        --lg-combobox-input-transition: width 150ms ease-in-out;\n      `;\n    }\n\n    // TODO - look into animating input element height on wrap\n    case 'expand-y': {\n      return css`\n        ${baseWrapperStyle}\n        display: flex;\n        flex-wrap: wrap;\n        gap: 4px;\n        overflow-x: visible;\n      `;\n    }\n  }\n};\n\nexport const inputElementStyle = css`\n  border: none;\n  cursor: inherit;\n  background-color: inherit;\n  box-sizing: content-box;\n  padding-block: calc(\n    (var(--lg-combobox-height) - var(--lg-combobox-line-height)) / 2\n  );\n  padding-inline: 0;\n  height: var(--lg-combobox-line-height);\n  width: var(\n    --lg-combobox-input-width,\n    var(--lg-combobox-input-default-width, auto)\n  );\n  transition: var(--lg-combobox-input-transition);\n\n  &:focus {\n    outline: none;\n  }\n`;\n\nexport const clearButton = css`\n  // Add a negative margin so the button takes up the same space as the regular icons\n  margin-block: calc(var(--lg-combobox-icon-height) / 2 - 100%);\n`;\n\nexport const errorMessageStyle = css`\n  font-size: var(--lg-combobox-font-size);\n  line-height: var(--lg-combobox-line-height);\n  color: var(--lg-combobox-color-error);\n  padding-top: var(--lg-combobox-padding-y);\n`;\n\nexport const endIcon = css`\n  margin-inline-end: calc(var(--lg-combobox-padding-x) / 2);\n`;\n\nconst loadingIconAnimation = keyframes`\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n`;\nexport const loadingIconStyle = css`\n  animation: ${loadingIconAnimation} 1.5s linear infinite;\n`;\n\n/**\n * Menu styles\n */\nexport const menuWrapperStyle = ({\n  darkMode,\n  size,\n  width = 384,\n}: {\n  darkMode: boolean;\n  size: ComboboxSize;\n  width?: number;\n}) => {\n  let menuModeStyle, menuSizeStyle;\n\n  if (darkMode) {\n    menuModeStyle = css``;\n  } else {\n    menuModeStyle = css`\n      --lg-combobox-menu-color: ${uiColors.gray.dark3};\n      --lg-combobox-menu-message-color: ${uiColors.gray.dark1};\n      --lg-combobox-menu-background-color: ${uiColors.white};\n      --lg-combobox-menu-shadow: 0px 3px 7px rgba(0, 0, 0, 0.25);\n      --lg-combobox-item-hover-color: ${uiColors.gray.light2};\n      --lg-combobox-item-active-color: ${uiColors.blue.light3};\n      --lg-combobox-item-wedge-color: ${uiColors.blue.base};\n    `;\n  }\n\n  switch (size) {\n    case 'default':\n      menuSizeStyle = css`\n        --lg-combobox-menu-border-radius: 4px;\n        --lg-combobox-item-height: 36px;\n        --lg-combobox-item-padding-y: 8px;\n        --lg-combobox-item-padding-x: 12px;\n        --lg-combobox-item-font-size: 14px;\n        --lg-combobox-item-line-height: 21px;\n        --lg-combobox-item-wedge-height: 22px;\n      `;\n  }\n\n  return cx(\n    menuModeStyle,\n    menuSizeStyle,\n    css`\n      width: ${width}px;\n      border-radius: var(--lg-combobox-menu-border-radius);\n\n      & > * {\n        border-radius: inherit;\n      }\n    `,\n  );\n};\n\nexport const menuStyle = ({ maxHeight }: { maxHeight: number }) => css`\n  position: relative;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  font-family: ${fontFamilies.default};\n  color: var(--lg-combobox-menu-color);\n  background-color: var(--lg-combobox-menu-background-color);\n  box-shadow: var(--lg-combobox-menu-shadow);\n  border-radius: inherit;\n  overflow: auto;\n  min-height: var(--lg-combobox-item-height);\n  max-height: ${maxHeight}px;\n  scroll-behavior: smooth;\n`;\n\nexport const menuList = css`\n  position: relative;\n  margin: 0;\n  padding: 0;\n`;\n\nexport const menuMessage = css`\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-size: var(--lg-combobox-item-font-size);\n  color: var(--lg-combobox-menu-message-color);\n  padding: var(--lg-combobox-item-padding-y) var(--lg-combobox-item-padding-x);\n\n  & > svg {\n    width: 1em;\n    height: 1em;\n  }\n`;\n","import { css, cx } from '@leafygreen-ui/emotion';\nimport { useIdAllocator } from '@leafygreen-ui/hooks';\nimport { uiColors } from '@leafygreen-ui/palette';\nimport React, { useContext } from 'react';\nimport { ComboboxGroupProps } from './Combobox.types';\nimport { ComboboxContext } from './ComboboxContext';\n\nconst comboboxGroupStyle = (darkMode: boolean) => css`\n  --lg-combobox-group-label-color: ${darkMode\n    ? uiColors.gray.light1\n    : uiColors.gray.dark1};\n  --lg-combobox-group-border-color: ${darkMode\n    ? uiColors.gray.dark1\n    : uiColors.gray.light1};\n  padding-top: 8px;\n  border-bottom: 1px solid var(--lg-combobox-group-border-color);\n`;\n\nconst comboboxGroupLabel = css`\n  cursor: default;\n  width: 100%;\n  padding: 0 12px 2px;\n  outline: none;\n  overflow-wrap: anywhere;\n  font-size: 12px;\n  line-height: 16px;\n  font-weight: bold;\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n  color: var(--lg-combobox-group-label-color);\n`;\n\nexport function InternalComboboxGroup({\n  label,\n  className,\n  children,\n}: ComboboxGroupProps): JSX.Element {\n  const { darkMode } = useContext(ComboboxContext);\n\n  const groupId = useIdAllocator({ prefix: 'combobox-group' });\n  const childCount = React.Children.count(children);\n\n  return childCount > 0 ? (\n    <div className={cx(comboboxGroupStyle(darkMode), className)}>\n      <div className={comboboxGroupLabel} id={groupId}>\n        {label}\n      </div>\n      <div role=\"group\" aria-labelledby={groupId}>\n        {children}\n      </div>\n    </div>\n  ) : (\n    <></>\n  );\n}\n\nComboboxGroup.displayName = 'ComboboxGroup';\n\nexport default function ComboboxGroup(_: ComboboxGroupProps): JSX.Element {\n  throw Error('`ComboboxGroup` must be a child of a `Combobox` instance');\n}\n","import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { clone, isArray, isNull, isString, isUndefined } from 'lodash';\nimport { Description, Label } from '@leafygreen-ui/typography';\nimport Popover from '@leafygreen-ui/popover';\nimport {\n  useDynamicRefs,\n  useEventListener,\n  useIdAllocator,\n  usePrevious,\n  useViewportSize,\n} from '@leafygreen-ui/hooks';\nimport InteractionRing from '@leafygreen-ui/interaction-ring';\nimport Icon from '@leafygreen-ui/icon';\nimport IconButton from '@leafygreen-ui/icon-button';\nimport { cx } from '@leafygreen-ui/emotion';\nimport { uiColors } from '@leafygreen-ui/palette';\nimport { isComponentType } from '@leafygreen-ui/lib';\nimport {\n  ComboboxProps,\n  getNullSelection,\n  onChangeType,\n  SelectValueType,\n} from './Combobox.types';\nimport { ComboboxContext } from './ComboboxContext';\nimport { InternalComboboxOption } from './ComboboxOption';\nimport { Chip } from './Chip';\nimport {\n  clearButton,\n  comboboxParentStyle,\n  comboboxStyle,\n  endIcon,\n  errorMessageStyle,\n  inputElementStyle,\n  inputWrapperStyle,\n  interactionRingColor,\n  interactionRingStyle,\n  loadingIconStyle,\n  menuList,\n  menuMessage,\n  menuStyle,\n  menuWrapperStyle,\n} from './Combobox.styles';\nimport { InternalComboboxGroup } from './ComboboxGroup';\nimport { flattenChildren, getNameAndValue, OptionObject, keyMap } from './util';\n\n/**\n * Component\n */\nexport default function Combobox<M extends boolean>({\n  children,\n  label,\n  description,\n  placeholder = 'Select',\n  'aria-label': ariaLabel,\n  disabled = false,\n  size = 'default',\n  darkMode = false,\n  state = 'none',\n  errorMessage,\n  searchState = 'unset',\n  searchEmptyMessage = 'No results found',\n  searchErrorMessage = 'Could not get results!',\n  searchLoadingMessage = 'Loading results...',\n  filteredOptions,\n  onFilter,\n  clearable = true,\n  onClear,\n  overflow = 'expand-y',\n  multiselect = false as M,\n  initialValue,\n  onChange,\n  value,\n  chipTruncationLocation,\n  chipCharacterLimit = 12,\n  className,\n  ...rest\n}: ComboboxProps<M>) {\n  const getOptionRef = useDynamicRefs<HTMLLIElement>({ prefix: 'option' });\n  const getChipRef = useDynamicRefs<HTMLSpanElement>({ prefix: 'chip' });\n\n  const inputId = useIdAllocator({ prefix: 'combobox-input' });\n  const labelId = useIdAllocator({ prefix: 'combobox-label' });\n  const menuId = useIdAllocator({ prefix: 'combobox-menu' });\n\n  const comboboxRef = useRef<HTMLDivElement>(null);\n  const clearButtonRef = useRef<HTMLButtonElement>(null);\n  const inputWrapperRef = useRef<HTMLDivElement>(null);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const menuRef = useRef<HTMLDivElement>(null);\n\n  const [isOpen, setOpen] = useState(false);\n  const prevOpenState = usePrevious(isOpen);\n  const [focusedOption, setFocusedOption] = useState<string | null>(null);\n  const [selection, setSelection] = useState<SelectValueType<M> | null>(null);\n  const prevSelection = usePrevious(selection);\n  const [inputValue, setInputValue] = useState<string>('');\n  const prevValue = usePrevious(inputValue);\n  const [focusedChip, setFocusedChip] = useState<string | null>(null);\n\n  const doesSelectionExist =\n    !isNull(selection) &&\n    ((isArray(selection) && selection.length > 0) || isString(selection));\n\n  // Tells typescript that selection is multiselect\n  const isMultiselect = useCallback(\n    <T extends number | string>(test: Array<T> | T | null): test is Array<T> =>\n      multiselect && isArray(test),\n    [multiselect],\n  );\n\n  // Force focus of input box\n  const setInputFocus = useCallback(\n    (cursorPos?: number) => {\n      if (!disabled && inputRef && inputRef.current) {\n        inputRef.current.focus();\n        if (!isUndefined(cursorPos)) {\n          inputRef.current.setSelectionRange(cursorPos, cursorPos);\n        }\n      }\n    },\n    [disabled],\n  );\n\n  // Update selection differently in mulit & single select\n  const updateSelection = useCallback(\n    (value: string | null) => {\n      if (isMultiselect(selection)) {\n        const newSelection: SelectValueType<M> = clone(selection);\n\n        if (isNull(value)) {\n          newSelection.length = 0;\n        } else {\n          if (selection.includes(value)) {\n            // remove from array\n            newSelection.splice(newSelection.indexOf(value), 1);\n          } else {\n            // add to array\n            newSelection.push(value);\n            // clear text\n            setInputValue('');\n          }\n        }\n        setSelection(newSelection);\n        (onChange as onChangeType<true>)?.(\n          newSelection as SelectValueType<true>,\n        );\n      } else {\n        const newSelection: SelectValueType<M> = value as SelectValueType<M>;\n        setSelection(newSelection);\n        (onChange as onChangeType<false>)?.(\n          newSelection as SelectValueType<false>,\n        );\n      }\n    },\n    [isMultiselect, onChange, selection],\n  );\n\n  // Scrolls the combobox to the far right\n  // Used when `overflow == 'scroll-x'`\n  const scrollToEnd = () => {\n    if (inputWrapperRef && inputWrapperRef.current) {\n      // TODO - consider converting to .scrollTo(). This is not yet wuppoted in IE or jsdom\n      inputWrapperRef.current.scrollLeft = inputWrapperRef.current.scrollWidth;\n    }\n  };\n\n  const placeholderValue =\n    multiselect && isArray(selection) && selection.length > 0\n      ? undefined\n      : placeholder;\n\n  const allOptions = useMemo(() => flattenChildren(children), [children]);\n\n  const getDisplayNameForValue = useCallback(\n    (value: string | null): string => {\n      return value\n        ? allOptions.find(opt => opt.value === value)?.displayName ?? value\n        : '';\n    },\n    [allOptions],\n  );\n\n  // Computes whether the option is visible based on the current input\n  const isOptionVisible = useCallback(\n    (option: string | OptionObject): boolean => {\n      const value = typeof option === 'string' ? option : option.value;\n\n      // If filtered options are provided\n      if (filteredOptions && filteredOptions.length > 0) {\n        return filteredOptions.includes(value);\n      }\n\n      // otherwise, we do our own filtering\n      const displayName =\n        typeof option === 'string'\n          ? getDisplayNameForValue(value)\n          : option.displayName;\n      return displayName.toLowerCase().includes(inputValue.toLowerCase());\n    },\n    [filteredOptions, getDisplayNameForValue, inputValue],\n  );\n\n  const visibleOptions = useMemo(() => allOptions.filter(isOptionVisible), [\n    allOptions,\n    isOptionVisible,\n  ]);\n\n  const isValueValid = useCallback(\n    (value: string | null): boolean => {\n      return value ? !!allOptions.find(opt => opt.value === value) : false;\n    },\n    [allOptions],\n  );\n\n  const getIndexOfValue = useCallback(\n    (value: string | null): number => {\n      return visibleOptions\n        ? visibleOptions.findIndex(option => option.value === value)\n        : -1;\n    },\n    [visibleOptions],\n  );\n\n  const getValueAtIndex = useCallback(\n    (index: number): string | undefined => {\n      if (visibleOptions && visibleOptions.length >= index) {\n        const option = visibleOptions[index];\n        return option ? option.value : undefined;\n      }\n    },\n    [visibleOptions],\n  );\n\n  const getActiveChipIndex = useCallback(\n    () =>\n      isMultiselect(selection)\n        ? selection.findIndex(value =>\n            getChipRef(value)?.current?.contains(document.activeElement),\n          )\n        : -1,\n    [getChipRef, isMultiselect, selection],\n  );\n\n  /**\n   *\n   * Focus Management\n   *\n   */\n\n  const getFocusedElementName = useCallback(() => {\n    const isFocusOn = {\n      Input: inputRef.current?.contains(document.activeElement),\n      ClearButton: clearButtonRef.current?.contains(document.activeElement),\n      Chip:\n        isMultiselect(selection) &&\n        selection.some(value =>\n          getChipRef(value)?.current?.contains(document.activeElement),\n        ),\n    };\n    const getActiveChipIndex = () =>\n      isMultiselect(selection)\n        ? selection.findIndex(value =>\n            getChipRef(value)?.current?.contains(document.activeElement),\n          )\n        : -1;\n\n    if (isMultiselect(selection) && isFocusOn.Chip) {\n      if (getActiveChipIndex() === 0) {\n        return 'FirstChip';\n      } else if (getActiveChipIndex() === selection.length - 1) {\n        return 'LastChip';\n      }\n\n      return 'MiddleChip';\n    } else if (isFocusOn.Input) {\n      return 'Input';\n    } else if (isFocusOn.ClearButton) {\n      return 'ClearButton';\n    } else if (comboboxRef.current?.contains(document.activeElement)) {\n      return 'Combobox';\n    }\n  }, [getChipRef, isMultiselect, selection]);\n\n  type Direction = 'next' | 'prev' | 'first' | 'last';\n  const updateFocusedOption = useCallback(\n    (direction: Direction) => {\n      const optionsCount = visibleOptions?.length ?? 0;\n      const lastIndex = optionsCount - 1 > 0 ? optionsCount - 1 : 0;\n      const indexOfFocus = getIndexOfValue(focusedOption);\n\n      // Remove focus from chip\n      if (direction && isOpen) {\n        setFocusedChip(null);\n        setInputFocus();\n      }\n\n      switch (direction) {\n        case 'next': {\n          const newValue =\n            indexOfFocus + 1 < optionsCount\n              ? getValueAtIndex(indexOfFocus + 1)\n              : getValueAtIndex(0);\n\n          setFocusedOption(newValue ?? null);\n          break;\n        }\n\n        case 'prev': {\n          const newValue =\n            indexOfFocus - 1 >= 0\n              ? getValueAtIndex(indexOfFocus - 1)\n              : getValueAtIndex(lastIndex);\n\n          setFocusedOption(newValue ?? null);\n          break;\n        }\n\n        case 'last': {\n          const newValue = getValueAtIndex(lastIndex);\n          setFocusedOption(newValue ?? null);\n          break;\n        }\n\n        case 'first':\n        default: {\n          const newValue = getValueAtIndex(0);\n          setFocusedOption(newValue ?? null);\n        }\n      }\n    },\n    [\n      focusedOption,\n      getIndexOfValue,\n      getValueAtIndex,\n      isOpen,\n      setInputFocus,\n      visibleOptions?.length,\n    ],\n  );\n\n  const updateFocusedChip = useCallback(\n    (direction: Direction | null, relativeToIndex?: number) => {\n      if (isMultiselect(selection)) {\n        switch (direction) {\n          case 'next': {\n            const referenceChipIndex = relativeToIndex ?? getActiveChipIndex();\n            const nextChipIndex =\n              referenceChipIndex + 1 < selection.length\n                ? referenceChipIndex + 1\n                : selection.length - 1;\n            const nextChipValue = selection[nextChipIndex];\n            setFocusedChip(nextChipValue);\n            break;\n          }\n\n          case 'prev': {\n            const referenceChipIndex = relativeToIndex ?? getActiveChipIndex();\n            const prevChipIndex =\n              referenceChipIndex > 0\n                ? referenceChipIndex - 1\n                : referenceChipIndex < 0\n                ? selection.length - 1\n                : 0;\n            const prevChipValue = selection[prevChipIndex];\n            setFocusedChip(prevChipValue);\n            break;\n          }\n\n          case 'first': {\n            const firstChipValue = selection[0];\n            setFocusedChip(firstChipValue);\n            break;\n          }\n\n          case 'last': {\n            const lastChipValue = selection[selection.length - 1];\n            setFocusedChip(lastChipValue);\n            break;\n          }\n\n          default:\n            setFocusedChip(null);\n            break;\n        }\n      }\n    },\n    [getActiveChipIndex, isMultiselect, selection],\n  );\n\n  const handleArrowKey = useCallback(\n    (direction: 'left' | 'right', event: React.KeyboardEvent<Element>) => {\n      // Remove focus from menu\n      if (direction) setFocusedOption(null);\n\n      const focusedElementName = getFocusedElementName();\n\n      switch (direction) {\n        case 'right':\n          switch (focusedElementName) {\n            case 'Input': {\n              // If cursor is at the end of the input\n              if (\n                inputRef.current?.selectionEnd ===\n                inputRef.current?.value.length\n              ) {\n                clearButtonRef.current?.focus();\n              }\n              break;\n            }\n\n            case 'LastChip': {\n              // if focus is on last chip, go to input\n              event.preventDefault();\n              setInputFocus(0);\n              updateFocusedChip(null);\n              break;\n            }\n\n            case 'FirstChip':\n            case 'MiddleChip': {\n              updateFocusedChip('next');\n              break;\n            }\n\n            case 'ClearButton':\n            default:\n              break;\n          }\n          break;\n\n        case 'left':\n          switch (focusedElementName) {\n            case 'ClearButton': {\n              event.preventDefault();\n              setInputFocus(inputRef?.current?.value.length);\n              break;\n            }\n\n            case 'Input':\n            case 'MiddleChip':\n            case 'LastChip': {\n              if (isMultiselect(selection)) {\n                // Break if cursor is not at the start of the input\n                if (\n                  focusedElementName === 'Input' &&\n                  inputRef.current?.selectionStart !== 0\n                ) {\n                  break;\n                }\n\n                updateFocusedChip('prev');\n              }\n              break;\n            }\n\n            case 'FirstChip':\n            default:\n              break;\n          }\n          break;\n        default:\n          updateFocusedChip(null);\n          break;\n      }\n    },\n    [\n      getFocusedElementName,\n      isMultiselect,\n      selection,\n      setInputFocus,\n      updateFocusedChip,\n    ],\n  );\n\n  // Update the focused option when the inputValue changes\n  useEffect(() => {\n    if (inputValue !== prevValue) {\n      updateFocusedOption('first');\n    }\n  }, [inputValue, isOpen, prevValue, updateFocusedOption]);\n\n  // When the focused option chenges, update the menu scroll if necessary\n  useEffect(() => {\n    if (focusedOption) {\n      const focusedElementRef = getOptionRef(focusedOption);\n\n      if (focusedElementRef && focusedElementRef.current && menuRef.current) {\n        const { offsetTop: optionTop } = focusedElementRef.current;\n        const {\n          scrollTop: menuScroll,\n          offsetHeight: menuHeight,\n        } = menuRef.current;\n\n        if (optionTop > menuHeight || optionTop < menuScroll) {\n          menuRef.current.scrollTop = optionTop;\n        }\n      }\n    }\n  }, [focusedOption, getOptionRef]);\n\n  /**\n   *\n   * Rendering\n   *\n   */\n  const renderInternalOptions = useCallback(\n    (_children: React.ReactNode) => {\n      return React.Children.map(_children, child => {\n        if (isComponentType(child, 'ComboboxOption')) {\n          const { value, displayName } = getNameAndValue(child.props);\n\n          if (isOptionVisible(value)) {\n            const { className, glyph } = child.props;\n            const index = allOptions.findIndex(opt => opt.value === value);\n\n            const isFocused = focusedOption === value;\n            const isSelected = isMultiselect(selection)\n              ? selection.includes(value)\n              : selection === value;\n\n            const setSelected = () => {\n              setFocusedOption(value);\n              updateSelection(value);\n              setInputFocus();\n\n              if (value === selection) {\n                closeMenu();\n              }\n            };\n\n            const optionRef = getOptionRef(value);\n\n            return (\n              <InternalComboboxOption\n                value={value}\n                displayName={displayName}\n                isFocused={isFocused}\n                isSelected={isSelected}\n                setSelected={setSelected}\n                glyph={glyph}\n                className={className}\n                index={index}\n                ref={optionRef}\n              />\n            );\n          }\n        } else if (isComponentType(child, 'ComboboxGroup')) {\n          const nestedChildren = renderInternalOptions(child.props.children);\n\n          if (nestedChildren && nestedChildren?.length > 0) {\n            return (\n              <InternalComboboxGroup\n                label={child.props.label}\n                className={child.props.className}\n              >\n                {renderInternalOptions(nestedChildren)}\n              </InternalComboboxGroup>\n            );\n          }\n        }\n      });\n    },\n    [\n      allOptions,\n      focusedOption,\n      getOptionRef,\n      isMultiselect,\n      isOptionVisible,\n      selection,\n      setInputFocus,\n      updateSelection,\n    ],\n  );\n\n  const renderedOptions = useMemo(() => renderInternalOptions(children), [\n    children,\n    renderInternalOptions,\n  ]);\n\n  const renderedChips = useMemo(() => {\n    if (isMultiselect(selection)) {\n      return selection.filter(isValueValid).map((value, index) => {\n        const displayName = getDisplayNameForValue(value);\n\n        const onRemove = () => {\n          updateFocusedChip('next', index);\n          updateSelection(value);\n        };\n\n        const isFocused = focusedChip === value;\n        const chipRef = getChipRef(value);\n\n        const onFocus = () => {\n          setFocusedChip(value);\n        };\n\n        return (\n          <Chip\n            key={value}\n            displayName={displayName}\n            isFocused={isFocused}\n            onRemove={onRemove}\n            onFocus={onFocus}\n            ref={chipRef}\n          />\n        );\n      });\n    }\n  }, [\n    isMultiselect,\n    selection,\n    isValueValid,\n    getDisplayNameForValue,\n    focusedChip,\n    getChipRef,\n    updateFocusedChip,\n    updateSelection,\n  ]);\n\n  const renderedInputIcons = useMemo(() => {\n    const handleClearButtonClick = (\n      e: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n    ) => {\n      if (!disabled) {\n        updateSelection(null);\n        onClear?.(e);\n        onFilter?.('');\n        if (!isOpen) {\n          openMenu();\n        }\n      }\n    };\n\n    return (\n      <>\n        {clearable && doesSelectionExist && (\n          <IconButton\n            aria-label=\"Clear selection\"\n            aria-disabled={disabled}\n            disabled={disabled}\n            ref={clearButtonRef}\n            onClick={handleClearButtonClick}\n            onFocus={handleClearButtonFocus}\n            className={clearButton}\n          >\n            <Icon glyph=\"XWithCircle\" />\n          </IconButton>\n        )}\n        {state === 'error' ? (\n          <Icon glyph=\"Warning\" color={uiColors.red.base} className={endIcon} />\n        ) : (\n          <Icon glyph=\"CaretDown\" className={endIcon} />\n        )}\n      </>\n    );\n  }, [\n    clearable,\n    doesSelectionExist,\n    disabled,\n    state,\n    updateSelection,\n    onClear,\n    onFilter,\n    isOpen,\n  ]);\n\n  // Do any of the options have an icon?\n  const withIcons = useMemo(() => allOptions.some(opt => opt.hasGlyph), [\n    allOptions,\n  ]);\n\n  /**\n   *\n   * Selection Management\n   *\n   */\n\n  const onCloseMenu = useCallback(() => {\n    if (!isMultiselect(selection) && selection === prevSelection) {\n      const exactMatchedOption = visibleOptions.find(\n        option =>\n          option.displayName === inputValue || option.value === inputValue,\n      );\n\n      // check if inputValue is matches a valid option\n      // Set the selection to that value if the component is not controlled\n      if (exactMatchedOption && !value) {\n        setSelection(exactMatchedOption.value as SelectValueType<M>);\n      } else {\n        // Revert the value to the previous selection\n        const displayName =\n          getDisplayNameForValue(selection as SelectValueType<false>) ?? '';\n        setInputValue(displayName);\n      }\n    }\n  }, [\n    getDisplayNameForValue,\n    inputValue,\n    isMultiselect,\n    prevSelection,\n    selection,\n    value,\n    visibleOptions,\n  ]);\n\n  const onSelect = useCallback(() => {\n    if (doesSelectionExist) {\n      if (isMultiselect(selection)) {\n        // Scroll the wrapper to the end. No effect if not `overflow=\"scroll-x\"`\n        scrollToEnd();\n      } else if (!isMultiselect(selection)) {\n        // Update the text input\n        const displayName =\n          getDisplayNameForValue(selection as SelectValueType<false>) ?? '';\n        setInputValue(displayName);\n        closeMenu();\n      }\n    } else {\n      setInputValue('');\n    }\n  }, [doesSelectionExist, getDisplayNameForValue, isMultiselect, selection]);\n\n  // Set initialValue\n  useEffect(() => {\n    if (initialValue) {\n      if (isArray(initialValue)) {\n        // Ensure the values we set are real options\n        const filteredValue =\n          initialValue.filter(value => isValueValid(value)) ?? [];\n        setSelection(filteredValue as SelectValueType<M>);\n      } else {\n        if (isValueValid(initialValue as string)) {\n          setSelection(initialValue);\n        }\n      }\n    } else {\n      setSelection(getNullSelection(multiselect));\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  // When controlled value changes, update the selection\n  useEffect(() => {\n    if (!isUndefined(value) && value !== prevValue) {\n      if (isNull(value)) {\n        setSelection(null);\n      } else if (isMultiselect(value)) {\n        // Ensure the value(s) passed in are valid options\n        const newSelection = value.filter(isValueValid) as SelectValueType<M>;\n        setSelection(newSelection);\n      } else {\n        setSelection(\n          isValueValid(value as SelectValueType<false>) ? value : null,\n        );\n      }\n    }\n  }, [isMultiselect, isValueValid, prevValue, value]);\n\n  // onSelect\n  // Side effects to run when the selection changes\n  useEffect(() => {\n    if (selection !== prevSelection) {\n      onSelect();\n    }\n  }, [onSelect, prevSelection, selection]);\n\n  // when the menu closes, update the value if needed\n  useEffect(() => {\n    if (!isOpen && prevOpenState !== isOpen) {\n      onCloseMenu();\n    }\n  }, [isOpen, prevOpenState, onCloseMenu]);\n\n  /**\n   *\n   * Menu management\n   *\n   */\n  const closeMenu = () => setOpen(false);\n  const openMenu = () => setOpen(true);\n\n  const [menuWidth, setMenuWidth] = useState(0);\n  useEffect(() => {\n    setMenuWidth(comboboxRef.current?.clientWidth ?? 0);\n  }, [comboboxRef, isOpen, focusedOption, selection]);\n  const handleTransitionEnd = () => {\n    setMenuWidth(comboboxRef.current?.clientWidth ?? 0);\n  };\n\n  const renderedMenuContents = useMemo((): JSX.Element => {\n    switch (searchState) {\n      case 'loading': {\n        return (\n          <span className={menuMessage}>\n            <Icon\n              glyph=\"Refresh\"\n              color={uiColors.blue.base}\n              className={loadingIconStyle}\n            />\n            {searchLoadingMessage}\n          </span>\n        );\n      }\n\n      case 'error': {\n        return (\n          <span className={menuMessage}>\n            <Icon glyph=\"Warning\" color={uiColors.red.base} />\n            {searchErrorMessage}\n          </span>\n        );\n      }\n\n      case 'unset':\n      default: {\n        if (renderedOptions && renderedOptions.length > 0) {\n          return <ul className={menuList}>{renderedOptions}</ul>;\n        }\n\n        return <span className={menuMessage}>{searchEmptyMessage}</span>;\n      }\n    }\n  }, [\n    renderedOptions,\n    searchEmptyMessage,\n    searchErrorMessage,\n    searchLoadingMessage,\n    searchState,\n  ]);\n\n  const viewportSize = useViewportSize();\n\n  // Set the max height of the menu\n  const maxHeight = useMemo(() => {\n    // TODO - consolidate this hook with Select/ListMenu\n    const maxMenuHeight = 274;\n    const menuMargin = 8;\n\n    if (viewportSize && comboboxRef.current && menuRef.current) {\n      const {\n        top: triggerTop,\n        bottom: triggerBottom,\n      } = comboboxRef.current.getBoundingClientRect();\n\n      // Find out how much space is available above or below the trigger\n      const safeSpace = Math.max(\n        viewportSize.height - triggerBottom,\n        triggerTop,\n      );\n\n      // if there's more than enough space, set to maxMenuHeight\n      // otherwise fill the space available\n      return Math.min(maxMenuHeight, safeSpace - menuMargin);\n    }\n\n    return maxMenuHeight;\n  }, [viewportSize, comboboxRef, menuRef]);\n\n  // Scroll the menu when the focus changes\n  useEffect(() => {\n    // get the focused option\n  }, [focusedOption]);\n\n  /**\n   *\n   * Event Handlers\n   *\n   */\n\n  // Prevent combobox from gaining focus by default\n  const handleInputWrapperMousedown = (e: React.MouseEvent) => {\n    if (e.target !== inputRef.current) {\n      e.preventDefault();\n    }\n  };\n\n  // Set focus to the input element on click\n  const handleInputWrapperClick = (e: React.MouseEvent) => {\n    if (e.target !== inputRef.current) {\n      let cursorPos = 0;\n\n      if (inputRef.current) {\n        const mouseX = e.nativeEvent.offsetX;\n        const inputRight =\n          inputRef.current.offsetLeft + inputRef.current.clientWidth;\n        cursorPos = mouseX > inputRight ? inputValue.length : 0;\n      }\n\n      setInputFocus(cursorPos);\n    }\n  };\n\n  // Fired when the wrapper gains focus\n  const handleInputWrapperFocus = () => {\n    scrollToEnd();\n    openMenu();\n  };\n\n  // Fired onChange\n  const handleInputChange = ({\n    target: { value },\n  }: React.ChangeEvent<HTMLInputElement>) => {\n    setInputValue(value);\n    // fire any filter function passed in\n    onFilter?.(value);\n  };\n\n  const handleClearButtonFocus = () => {\n    setFocusedOption(null);\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    const isFocusInMenu = menuRef.current?.contains(document.activeElement);\n    const isFocusOnCombobox = comboboxRef.current?.contains(\n      document.activeElement,\n    );\n\n    const isFocusInComponent = isFocusOnCombobox || isFocusInMenu;\n\n    if (isFocusInComponent) {\n      // No support for modifiers yet\n      // TODO - Handle support for multiple chip selection\n      if (event.ctrlKey || event.shiftKey || event.altKey) {\n        return;\n      }\n\n      const focusedElement = getFocusedElementName();\n\n      switch (event.keyCode) {\n        case keyMap.Tab: {\n          switch (focusedElement) {\n            case 'Input': {\n              if (!doesSelectionExist) {\n                closeMenu();\n                updateFocusedOption('first');\n                updateFocusedChip(null);\n              }\n              // else use default behavior\n              break;\n            }\n\n            case 'LastChip': {\n              // use default behavior\n              updateFocusedChip(null);\n              break;\n            }\n\n            case 'FirstChip':\n            case 'MiddleChip': {\n              // use default behavior\n              break;\n            }\n\n            case 'ClearButton':\n            default:\n              break;\n          }\n\n          break;\n        }\n\n        case keyMap.Escape: {\n          closeMenu();\n          updateFocusedOption('first');\n          break;\n        }\n\n        case keyMap.Enter:\n        case keyMap.Space: {\n          if (isOpen) {\n            // prevent typing the space character\n            event.preventDefault();\n          }\n\n          if (\n            // Focused on input element\n            document.activeElement === inputRef.current &&\n            isOpen &&\n            !isNull(focusedOption)\n          ) {\n            updateSelection(focusedOption);\n          } else if (\n            // Focused on clear button\n            document.activeElement === clearButtonRef.current\n          ) {\n            updateSelection(null);\n            setInputFocus();\n          }\n          break;\n        }\n\n        case keyMap.Backspace: {\n          // Backspace key focuses last chip\n          // Delete key does not\n          if (\n            isMultiselect(selection) &&\n            inputRef.current?.selectionStart === 0\n          ) {\n            updateFocusedChip('last');\n          } else {\n            openMenu();\n          }\n          break;\n        }\n\n        case keyMap.ArrowDown: {\n          if (isOpen) {\n            // Prevent the page from scrolling\n            event.preventDefault();\n          }\n          openMenu();\n          updateFocusedOption('next');\n          break;\n        }\n\n        case keyMap.ArrowUp: {\n          if (isOpen) {\n            // Prevent the page from scrolling\n            event.preventDefault();\n          }\n          updateFocusedOption('prev');\n          break;\n        }\n\n        case keyMap.ArrowRight: {\n          handleArrowKey('right', event);\n          break;\n        }\n\n        case keyMap.ArrowLeft: {\n          handleArrowKey('left', event);\n          break;\n        }\n\n        default: {\n          if (!isOpen) {\n            openMenu();\n          }\n        }\n      }\n    }\n  };\n\n  /**\n   *\n   * Global Event Handler\n   *\n   */\n  // Global backdrop click handler\n  const handleBackdropClick = ({ target }: MouseEvent) => {\n    const isChildFocused =\n      menuRef.current?.contains(target as Node) ||\n      comboboxRef.current?.contains(target as Node) ||\n      false;\n\n    if (!isChildFocused) {\n      setOpen(false);\n    }\n  };\n  useEventListener('mousedown', handleBackdropClick);\n\n  return (\n    <ComboboxContext.Provider\n      value={{\n        multiselect,\n        darkMode,\n        size,\n        withIcons,\n        disabled,\n        chipTruncationLocation,\n        chipCharacterLimit,\n        inputValue,\n      }}\n    >\n      <div\n        className={cx(\n          comboboxParentStyle({ darkMode, size, overflow }),\n          className,\n        )}\n        {...rest}\n      >\n        <div>\n          {label && (\n            <Label id={labelId} htmlFor={inputId}>\n              {label}\n            </Label>\n          )}\n          {description && <Description>{description}</Description>}\n        </div>\n\n        <InteractionRing\n          className={interactionRingStyle}\n          disabled={disabled}\n          color={interactionRingColor({ state, darkMode })}\n        >\n          {/* Disable eslint: onClick sets focus. Key events would already have focus */}\n          {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events */}\n          <div\n            ref={comboboxRef}\n            role=\"combobox\"\n            aria-expanded={isOpen}\n            aria-controls={menuId}\n            aria-owns={menuId}\n            tabIndex={-1}\n            className={comboboxStyle}\n            onMouseDown={handleInputWrapperMousedown}\n            onClick={handleInputWrapperClick}\n            onFocus={handleInputWrapperFocus}\n            onKeyDown={handleKeyDown}\n            onTransitionEnd={handleTransitionEnd}\n            data-disabled={disabled}\n            data-state={state}\n          >\n            <div\n              ref={inputWrapperRef}\n              className={inputWrapperStyle({\n                overflow,\n                isOpen,\n                selection,\n                value: inputValue,\n              })}\n            >\n              {renderedChips}\n              <input\n                aria-label={ariaLabel ?? label}\n                aria-autocomplete=\"list\"\n                aria-controls={menuId}\n                aria-labelledby={labelId}\n                ref={inputRef}\n                id={inputId}\n                className={inputElementStyle}\n                placeholder={placeholderValue}\n                disabled={disabled ?? undefined}\n                onChange={handleInputChange}\n                value={inputValue}\n                autoComplete=\"off\"\n              />\n            </div>\n            {renderedInputIcons}\n          </div>\n        </InteractionRing>\n\n        {state === 'error' && errorMessage && (\n          <div className={errorMessageStyle}>{errorMessage}</div>\n        )}\n\n        {/******* /\n          *  Menu  *\n          / *******/}\n        <Popover\n          active={isOpen && !disabled}\n          spacing={4}\n          align=\"bottom\"\n          justify=\"middle\"\n          refEl={comboboxRef}\n          adjustOnMutation={true}\n          className={menuWrapperStyle({ darkMode, size, width: menuWidth })}\n        >\n          <div\n            id={menuId}\n            role=\"listbox\"\n            aria-labelledby={labelId}\n            aria-expanded={isOpen}\n            ref={menuRef}\n            className={menuStyle({ maxHeight })}\n            onMouseDownCapture={e => e.preventDefault()}\n          >\n            {renderedMenuContents}\n          </div>\n        </Popover>\n      </div>\n    </ComboboxContext.Provider>\n  );\n}\n","import { ReactElement, ReactNode } from 'react';\nimport { Either } from '@leafygreen-ui/lib';\n\n/**\n * Prop Enums & Types\n */\n\nexport const ComboboxSize = {\n  default: 'default',\n} as const;\nexport type ComboboxSize = typeof ComboboxSize[keyof typeof ComboboxSize];\n\nexport const TrunctationLocation = {\n  start: 'start',\n  middle: 'middle',\n  end: 'end',\n  none: 'none',\n} as const;\nexport type TrunctationLocation = typeof TrunctationLocation[keyof typeof TrunctationLocation];\n\nexport const Overflow = {\n  expandY: 'expand-y',\n  expandX: 'expand-x',\n  scrollY: 'scroll-x',\n} as const;\nexport type Overflow = typeof Overflow[keyof typeof Overflow];\n\nexport const State = {\n  error: 'error',\n  none: 'none',\n} as const;\nexport type State = typeof State[keyof typeof State];\n\nexport const SearchState = {\n  unset: 'unset',\n  error: 'error',\n  loading: 'loading',\n} as const;\nexport type SearchState = typeof SearchState[keyof typeof SearchState];\n\n/**\n * Generic Typing\n */\n\nexport type SelectValueType<M extends boolean> = M extends true\n  ? Array<string>\n  : string | null;\n\nexport type onChangeType<M extends boolean> = M extends true\n  ? (value: SelectValueType<true>) => void\n  : (value: SelectValueType<false>) => void;\n\n// Returns the correct empty state for multiselcect / single select\nexport function getNullSelection<M extends boolean>(\n  multiselect: M,\n): SelectValueType<M> {\n  if (multiselect) {\n    return ([] as Array<string>) as SelectValueType<M>;\n  } else {\n    return null as SelectValueType<M>;\n  }\n}\n\n/**\n * Combobox Props\n */\n\nexport interface ComboboxMultiselectProps<M extends boolean> {\n  /**\n   * Defines whether a user can select multiple options, or only a single option.\n   * When using TypeScript, `multiselect` affects the valid values of `initialValue`, `value`, and `onChange`\n   */\n  multiselect?: M;\n  /**\n   * The initial selection.\n   * Must be a string for a single-select, or an array of strings for multiselect.\n   * Changing the initialValue after initial render will not change the selection.\n   */\n  initialValue?: SelectValueType<M>;\n  /**\n   * A callback called when the selection changes.\n   * Callback recieves a single argument that is the new selection, either string, or string array\n   */\n  onChange?: onChangeType<M>;\n  /**\n   * The controlled value of the Combobox.\n   * Must be a string for a single-select, or an array of strings for multiselect.\n   * Changing value after initial render will affect the selection.\n   */\n  value?: SelectValueType<M>;\n  /**\n   * Defines the overflow behavior of a multiselect combobox.\n   *\n   * `expand-y`: Combobox has fixed width, and additional selections will cause the element to grow in the block direction.\n   *\n   * `expand-x`: Combobox has fixed height, and additional selections will cause the elemenet to grow in the inline direction.\n   *\n   * `scroll-x`: Combobox has fixed height and width, and additional selections will cause the element to be scrollable in the x (horizontal) direction.\n   */\n  overflow?: M extends true ? Overflow : undefined;\n}\n\nexport interface BaseComboboxProps {\n  /**\n   * Defines the Combobox Options by passing children. Must be `ComboboxOption` or `ComboboxGroup`\n   */\n  children?: ReactNode;\n\n  /**\n   * An accessible label for the input, rendered in a <label> to the DOM\n   */\n  label?: string;\n\n  /**\n   * An accessible label for the input, used only for screen-readers\n   */\n  'aria-label'?: string;\n\n  /**\n   * A description for the input\n   */\n  description?: string;\n\n  /**\n   * A placeholder for the input element. Uses the native `placeholder` attribute.\n   */\n  placeholder?: string;\n\n  /**\n   * Disables all interaction with the component\n   */\n  disabled?: boolean;\n\n  /**\n   * Defines the visual size of the component\n   */\n  size?: ComboboxSize;\n\n  /**\n   * Toggles Dark Mode\n   */\n  darkMode?: boolean;\n\n  /**\n   * The error state of the component. Defines whether the error message is displayed.\n   */\n  state?: State;\n\n  /**\n   * The message shown below the input when state is `error`\n   */\n  errorMessage?: string;\n\n  /**\n   * The state of search results. Toggles search messages within the menu.\n   */\n  searchState?: SearchState;\n\n  /**\n   * A message shown within the menu when there are no options passed in as children, or `filteredOptions` is an empty array\n   */\n  searchEmptyMessage?: string;\n\n  /**\n   * A message shown within the menu when searchState is `error`\n   */\n  searchErrorMessage?: string;\n\n  /**\n   * A message shown within the menu when searchState is `loading`\n   */\n  searchLoadingMessage?: string;\n\n  /**\n   * A callback called when the search input changes.\n   * Recieves a single argument that is the current input value.\n   * Use this callback to set `searchState` and/or `filteredOptions` appropriately\n   */\n  onFilter?: (value: string) => void;\n\n  /**\n   * Defines whether the Clear button appears to the right of the input.\n   */\n  clearable?: boolean;\n\n  /**\n   * A callback fired when the Clear button is pressed.\n   * Fired _after_ `onChange`, and _before_ `onFilter`\n   */\n  onClear?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n\n  /**\n   * An array used to define which options are displayed.\n   * Do not remove options from the JSX children, as this will affect the selected options\n   */\n  filteredOptions?: Array<string>;\n\n  /**\n   * Defines where the ellipses appear in a Chip when the length exceeds the `chipCharacterLimit`\n   */\n  chipTruncationLocation?: TrunctationLocation;\n\n  /**\n   * Defined the character limit of a multiselect Chip before they start truncating.\n   * Note: the three ellipses dots are included in the character limit.\n   */\n  chipCharacterLimit?: number;\n\n  /**\n   * Styling prop\n   */\n  className?: string;\n}\n\nexport type ComboboxProps<M extends boolean> = Either<\n  BaseComboboxProps & ComboboxMultiselectProps<M>,\n  'label' | 'aria-label'\n>;\n\n/**\n * Combobox Option Props\n */\ninterface BaseComboboxOptionProps {\n  /**\n   * The internal value of the option. Used as the identifier in Combobox `initialValue`, value and filteredOptions.\n   * When undefined, this is set to `_.kebabCase(displayName)`\n   */\n  value?: string;\n\n  /**\n   * The display value of the option. Used as the rendered string within the menu and chips.\n   * When undefined, this is set to `value`\n   */\n  displayName?: string;\n\n  /**\n   * The icon to display to the left of the option in the menu.\n   */\n  glyph?: ReactElement;\n\n  /**\n   * Styling Prop\n   */\n  className?: string;\n}\n\nexport type ComboboxOptionProps = Either<\n  BaseComboboxOptionProps,\n  'value' | 'displayName'\n>;\n\nexport interface InternalComboboxOptionProps {\n  value: string;\n  displayName: string;\n  isSelected: boolean;\n  isFocused: boolean;\n  setSelected: () => void;\n  glyph?: ReactElement;\n  className?: string;\n  index: number;\n}\n\n/**\n * Combobox Group Props\n */\n\nexport interface ComboboxGroupProps {\n  /**\n   * Label for the group of options\n   */\n  label: string;\n\n  /**\n   * Options in the group. Must be one or more `ComboboxOption` components\n   */\n  children: React.ReactNode;\n\n  /**\n   * Styling prop\n   */\n  className?: string;\n}\n\n/**\n * Combobox Chip\n */\n\nexport interface ChipProps {\n  displayName: string;\n  isFocused: boolean;\n  onRemove: () => void;\n  onFocus: () => void;\n}\n"],"names":["_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","ComboboxContext","createContext","multiselect","darkMode","size","withIcons","disabled","keyMap","_objectSpread","_keyMap","Backspace","Delete","wrapJSX","str","wrap","element","regex","RegExp","startIndex","search","endIndex","length","nameArr","split","start","slice","join","end","match","matchEl","React","createElement","___EmotionJSX","Fragment","getNameAndValue","_ref","_ref2","valProp","value","nameProp","displayName","kebabCase","flattenChildren","_children","Children","toArray","reduce","acc","child","isComponentType","_getNameAndValue","props","glyph","concat","_toConsumableArray","hasGlyph","children","flexSpan","css","_taggedTemplateLiteral","displayNameStyle","isSelected","InternalComboboxOption","forwardRef","forwardedRef","isFocused","setSelected","className","_useContext","useContext","inputValue","optionTextId","useIdAllocator","prefix","optionRef","useForwardedRef","handleOptionClick","useCallback","e","stopPropagation","target","current","tagName","renderedIcon","useMemo","isComponentGlyph","console","error","renderedChildren","checkbox","Checkbox","label","aria-labelledby","checked","tabIndex","animate","id","Icon","color","uiColors","blue","light1","base","ref","role","aria-selected","aria-label","cx","onClick","onKeyPress","ComboboxOption","_","Error","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","_templateObject18","_templateObject19","_templateObject20","_templateObject21","_templateObject22","_templateObject23","chipWrapperStyle","chipModeStyle","chipSizeStyle","gray","dark3","dark2","light2","chipText","chipButton","Chip","onRemove","onFocus","chipTruncationLocation","_useContext$chipChara","chipCharacterLimit","isTruncated","buttonRef","useRef","truncatedName","chars","substring","trim","useEffect","_buttonRef$current","focus","dataProp","createDataProp","_extends","data-test-id","prop","_buttonRef$current2","contains","InlineDefinition","definition","align","aria-disabled","onKeyDown","keyCode","Enter","Space","comboboxParentStyle","overflow","red","dark1","light3","white","modeStyle","sizeStyle","comboboxStyle","interactionRingStyle","interactionRingColor","state","hovered","undefined","inputWrapperStyle","_ref3","_value$length","isOpen","selection","isMultiselect","isArray","inputLength","inputWidth","baseWrapperStyle","inputElementStyle","clearButton","errorMessageStyle","endIcon","loadingIconAnimation","keyframes","loadingIconStyle","menuWrapperStyle","_ref4","menuModeStyle","menuSizeStyle","_ref4$width","width","menuStyle","_ref5","maxHeight","fontFamilies","default","menuList","menuMessage","comboboxGroupStyle","comboboxGroupLabel","InternalComboboxGroup","groupId","count","ComboboxGroup","_excluded","Combobox","description","_ref$placeholder","placeholder","ariaLabel","_ref$disabled","_ref$size","_ref$darkMode","_ref$state","errorMessage","_ref$searchState","searchState","_ref$searchEmptyMessa","searchEmptyMessage","_ref$searchErrorMessa","searchErrorMessage","_ref$searchLoadingMes","searchLoadingMessage","filteredOptions","onFilter","_ref$clearable","clearable","onClear","_ref$overflow","_ref$multiselect","initialValue","onChange","_ref$chipCharacterLim","rest","_objectWithoutProperties","getOptionRef","useDynamicRefs","getChipRef","inputId","labelId","menuId","comboboxRef","clearButtonRef","inputWrapperRef","inputRef","menuRef","_useState2","_slicedToArray","useState","setOpen","prevOpenState","usePrevious","_useState4","focusedOption","setFocusedOption","_useState6","setSelection","prevSelection","_useState8","setInputValue","prevValue","_useState10","focusedChip","setFocusedChip","doesSelectionExist","isNull","isString","test","setInputFocus","cursorPos","isUndefined","setSelectionRange","updateSelection","newSelection","clone","includes","splice","indexOf","push","_newSelection","scrollToEnd","scrollLeft","scrollWidth","placeholderValue","allOptions","getDisplayNameForValue","_allOptions$find$disp","_allOptions$find","find","opt","isOptionVisible","option","toLowerCase","visibleOptions","filter","isValueValid","getIndexOfValue","findIndex","getValueAtIndex","index","getActiveChipIndex","_getChipRef","_getChipRef$current","document","activeElement","getFocusedElementName","_inputRef$current","_clearButtonRef$curre","_comboboxRef$current","isFocusOn","some","_getChipRef2","_getChipRef2$current","_getChipRef3","_getChipRef3$current","updateFocusedOption","direction","_visibleOptions$lengt","optionsCount","lastIndex","indexOfFocus","newValue","_newValue","_newValue2","_newValue3","updateFocusedChip","relativeToIndex","referenceChipIndex","nextChipIndex","nextChipValue","_referenceChipIndex","prevChipIndex","prevChipValue","firstChipValue","lastChipValue","handleArrowKey","event","focusedElementName","_inputRef$current2","_inputRef$current3","_clearButtonRef$curre2","selectionEnd","preventDefault","_inputRef$current4","_inputRef$current5","selectionStart","focusedElementRef","optionTop","offsetTop","_menuRef$current","menuScroll","scrollTop","offsetHeight","renderInternalOptions","map","_value","_child$props","_className","closeMenu","nestedChildren","renderedOptions","renderedChips","chipRef","key","renderedInputIcons","IconButton","openMenu","handleClearButtonFocus","onCloseMenu","exactMatchedOption","_getDisplayNameForVal","onSelect","_getDisplayNameForVal2","_initialValue$filter","filteredValue","getNullSelection","_useState12","menuWidth","setMenuWidth","_comboboxRef$current$","_comboboxRef$current2","clientWidth","renderedMenuContents","viewportSize","useViewportSize","_comboboxRef$current$3","getBoundingClientRect","triggerTop","top","triggerBottom","bottom","safeSpace","Math","max","height","min","useEventListener","_menuRef$current3","_comboboxRef$current5","Provider","Label","htmlFor","Description","InteractionRing","aria-expanded","aria-controls","aria-owns","onMouseDown","nativeEvent","offsetX","offsetLeft","_menuRef$current2","_comboboxRef$current4","isFocusInMenu","ctrlKey","shiftKey","altKey","focusedElement","Tab","Escape","_inputRef$current6","ArrowDown","ArrowUp","ArrowRight","ArrowLeft","onTransitionEnd","_comboboxRef$current$2","_comboboxRef$current3","data-disabled","data-state","aria-autocomplete","autoComplete","Popover","active","spacing","justify","refEl","adjustOnMutation","onMouseDownCapture"],"mappings":"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"}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Combobox } from './Combobox';
+export { default as ComboboxOption } from './ComboboxOption';
+export { default as ComboboxGroup } from './ComboboxGroup';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/index.js

@@ -0,0 +1,2 @@
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("lodash"),require("@leafygreen-ui/typography"),require("@leafygreen-ui/popover"),require("@leafygreen-ui/hooks"),require("@leafygreen-ui/interaction-ring"),require("@leafygreen-ui/icon"),require("@leafygreen-ui/icon-button"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/palette"),require("@leafygreen-ui/lib"),require("@leafygreen-ui/checkbox"),require("@emotion/react"),require("@leafygreen-ui/inline-definition"),require("@leafygreen-ui/tokens")):"function"==typeof define&&define.amd?define(["exports","react","lodash","@leafygreen-ui/typography","@leafygreen-ui/popover","@leafygreen-ui/hooks","@leafygreen-ui/interaction-ring","@leafygreen-ui/icon","@leafygreen-ui/icon-button","@leafygreen-ui/emotion","@leafygreen-ui/palette","@leafygreen-ui/lib","@leafygreen-ui/checkbox","@emotion/react","@leafygreen-ui/inline-definition","@leafygreen-ui/tokens"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/combobox"]={},e.React,e._,e["@leafygreen-ui/typography"],e["@leafygreen-ui/popover"],e["@leafygreen-ui/hooks"],e["@leafygreen-ui/interaction-ring"],e["@leafygreen-ui/icon"],e["@leafygreen-ui/icon-button"],e["@leafygreen-ui/emotion"],e["@leafygreen-ui/palette"],e["@leafygreen-ui/lib"],e["@leafygreen-ui/checkbox"],e.react,e["@leafygreen-ui/inline-definition"],e["@leafygreen-ui/tokens"])}(this,(function(e,n,o,r,t,i,l,a,c,s,u,d,b,f,g,p){"use strict";function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=m(n),x=m(t),v=m(l),y=m(a),w=m(c),k=m(b),C=m(g);function j(e,n){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),o.push.apply(o,r)}return o}function N(e){for(var n=1;n<arguments.length;n++){var o=null!=arguments[n]?arguments[n]:{};n%2?j(Object(o),!0).forEach((function(n){O(e,n,o[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):j(Object(o)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(o,n))}))}return e}function O(e,n,o){return n in e?Object.defineProperty(e,n,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[n]=o,e}function M(){return(M=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var o=arguments[n];for(var r in o)Object.prototype.hasOwnProperty.call(o,r)&&(e[r]=o[r])}return e}).apply(this,arguments)}function E(e,n){if(null==e)return{};var o,r,t=function(e,n){if(null==e)return{};var o,r,t={},i=Object.keys(e);for(r=0;r<i.length;r++)o=i[r],n.indexOf(o)>=0||(t[o]=e[o]);return t}(e,n);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)o=i[r],n.indexOf(o)>=0||Object.prototype.propertyIsEnumerable.call(e,o)&&(t[o]=e[o])}return t}function S(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function I(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var o=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==o)return;var r,t,i=[],l=!0,a=!1;try{for(o=o.call(e);!(l=(r=o.next()).done)&&(i.push(r.value),!n||i.length!==n);l=!0);}catch(e){a=!0,t=e}finally{try{l||null==o.return||o.return()}finally{if(a)throw t}}return i}(e,n)||A(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function z(e){return function(e){if(Array.isArray(e))return D(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||A(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function A(e,n){if(e){if("string"==typeof e)return D(e,n);var o=Object.prototype.toString.call(e).slice(8,-1);return"Object"===o&&e.constructor&&(o=e.constructor.name),"Map"===o||"Set"===o?Array.from(e):"Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o)?D(e,n):void 0}}function D(e,n){(null==n||n>e.length)&&(n=e.length);for(var o=0,r=new Array(n);o<n;o++)r[o]=e[o];return r}var L,P,F,T,R,q,G,W,B,K=n.createContext({multiselect:!1,darkMode:!1,size:"default",withIcons:!1,disabled:!1}),U=N(N({},d.keyMap),{},{Backspace:8,Delete:46}),V=function(e,n,o){if(n&&o){var r=new RegExp(n,"gi"),t=e.search(r),i=t+n.length,l=e.split(""),a=l.slice(0,t).join(""),c=l.slice(i).join(""),s=l.slice(t,i).join(""),u=h.default.createElement(o,null,s);return f.jsx(h.default.Fragment,null,a,u,c)}return f.jsx(h.default.Fragment,null,e)},H=function(e){var n,r=e.value,t=e.displayName;return{value:null!=r?r:o.kebabCase(t),displayName:null!==(n=null!=t?t:r)&&void 0!==n?n:""}},X=function e(n){return h.default.Children.toArray(n).reduce((function(n,o){if(d.isComponentType(o,"ComboboxOption")){var r=H(o.props),t=r.value,i=r.displayName,l=o.props.glyph;return[].concat(z(n),[{value:t,displayName:i,hasGlyph:!!l}])}if(d.isComponentType(o,"ComboboxGroup")){var a=o.props.children;if(a)return[].concat(z(n),z(e(a)))}}),[])},_=s.css(P||(P=S(["\n  display: inline-flex;\n  gap: 8px;\n  justify-content: start;\n  align-items: inherit;\n"]))),Y=function(e){return s.css(F||(F=S(["\n  font-weight: ",";\n"])),e?"bold":"normal")},$=h.default.forwardRef((function(e,o){var r=e.displayName,t=e.glyph,l=e.isSelected,c=e.isFocused,b=e.setSelected,g=e.className,p=n.useContext(K),m=p.multiselect,x=p.darkMode,v=p.withIcons,w=p.inputValue,C=i.useIdAllocator({prefix:"combobox-option-text"}),j=i.useForwardedRef(o,null),N=n.useCallback((function(e){e.stopPropagation(),e.target!==j.current&&"INPUT"!==e.target.tagName||b()}),[j,b]),O=n.useMemo((function(){if(t){if(a.isComponentGlyph(t)||d.isComponentType(t,"Icon"))return t;console.error("`ComboboxOption` instance did not render icon because it is not a known glyph element.",t)}}),[t]),M=n.useMemo((function(){if(m){var e=f.jsx(k.default,{label:"","aria-labelledby":C,checked:l,tabIndex:-1,animate:!1});return f.jsx(h.default.Fragment,null,f.jsx("span",{className:_},v?O:e,f.jsx("span",{id:C,className:Y(l)},V(r,w,"strong"))),v&&e)}return f.jsx(h.default.Fragment,null,f.jsx("span",{className:_},O,f.jsx("span",{className:Y(l)},V(r,w,"strong"))),l&&f.jsx(y.default,{glyph:"Checkmark",color:x?u.uiColors.blue.light1:u.uiColors.blue.base}))}),[m,O,l,r,w,x,C,v]);return f.jsx("li",{ref:j,role:"option","aria-selected":c,"aria-label":r,tabIndex:-1,className:s.cx(s.css(L||(L=S(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  list-style: none;\n  color: inherit;\n  cursor: pointer;\n  overflow: hidden;\n  font-size: var(--lg-combobox-item-font-size);\n  line-height: var(--lg-combobox-item-line-height);\n  padding: var(--lg-combobox-item-padding-y) var(--lg-combobox-item-padding-x);\n\n  &:before {\n    content: '';\n    position: absolute;\n    left: 0;\n    width: 3px;\n    height: var(--lg-combobox-item-wedge-height);\n    background-color: transparent;\n    border-radius: 0 2px 2px 0;\n    transform: scaleY(0.3);\n    transition: 150ms ease-in-out;\n    transition-property: transform, background-color;\n  }\n\n  &:hover {\n    outline: none;\n    background-color: var(--lg-combobox-item-hover-color);\n  }\n\n  &[aria-selected='true'] {\n    outline: none;\n    background-color: var(--lg-combobox-item-active-color);\n\n    &:before {\n      background-color: var(--lg-combobox-item-wedge-color);\n      transform: scaleY(1);\n    }\n  }\n"]))),g),onClick:N,onKeyPress:N},M)}));function J(e){throw Error("`ComboboxOption` must be a child of a `Combobox` instance")}$.displayName="ComboboxOption",J.displayName="ComboboxOption";var Q,Z,ee,ne,oe,re,te,ie,le,ae,ce,se,ue,de,be,fe,ge,pe,me,he,xe,ve,ye,we=function(e){var n,o,r=e.darkMode,t=e.size;switch(n=r?s.css(T||(T=S([""]))):s.css(R||(R=S(["\n      --lg-combobox-chip-text-color: ",";\n      --lg-combobox-chip-icon-color: ",";\n      --lg-combobox-chip-background-color: ",";\n      --lg-combobox-chip-hover-color: ",";\n      --lg-combobox-chip-focus-color: ",";\n    "])),u.uiColors.gray.dark3,u.uiColors.gray.dark2,u.uiColors.gray.light2,u.uiColors.gray.light1,u.uiColors.blue.light2),t){case"default":o=s.css(q||(q=S(["\n        --lg-combobox-chip-height: 24px;\n        --lg-combobox-chip-border-radius: 4px;\n        --lg-combobox-chip-font-size: 14px;\n        --lg-combobox-chip-line-height: 20px;\n        --lg-combobox-chip-padding-x: 6px;\n      "])))}return s.cx(n,o,s.css(G||(G=S(["\n      display: inline-flex;\n      align-items: center;\n      overflow: hidden;\n      white-space: nowrap;\n      height: var(--lg-combobox-chip-height);\n      font-size: var(--lg-combobox-chip-font-size);\n      line-height: var(--lg-combobox-chip-line-height);\n      border-radius: var(--lg-combobox-chip-border-radius);\n      color: var(--lg-combobox-chip-text-color);\n      background-color: var(--lg-combobox-chip-background-color);\n\n      // TODO - refine these styles\n      /* &:focus, */\n      &:focus-within {\n        background-color: var(--lg-combobox-chip-focus-color);\n      }\n    "]))))},ke=s.css(W||(W=S(["\n  padding-inline: var(--lg-combobox-chip-padding-x);\n"]))),Ce=s.css(B||(B=S(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n  outline: none;\n  border: none;\n  background-color: transparent;\n  color: var(--lg-combobox-chip-icon-color);\n  cursor: pointer;\n  transition: background-color 100ms ease-in-out;\n\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 1px;\n    background-color: var(--lg-combobox-chip-hover-color);\n  }\n\n  &:hover {\n    background-color: var(--lg-combobox-chip-hover-color);\n  }\n"]))),je=h.default.forwardRef((function(e,o){var r=e.displayName,t=e.isFocused,i=e.onRemove,l=e.onFocus,a=n.useContext(K),c=a.darkMode,s=a.size,u=a.disabled,b=a.chipTruncationLocation,g=a.chipCharacterLimit,p=void 0===g?12:g,m=!!p&&!!b&&"none"!==b&&r.length>p,h=n.useRef(null),x=n.useMemo((function(){if(m){var e=p-3;switch(b){case"start":return"…"+r.substring(r.length-e).trim();case"middle":return r.substring(0,e/2).trim()+"…"+r.substring(r.length-e/2).trim();case"end":return r.substring(0,e).trim()+"…";default:return r}}return!1}),[p,b,r,m]);n.useEffect((function(){var e;t&&!u&&(null==h||null===(e=h.current)||void 0===e||e.focus())}),[u,o,t]);var v=d.createDataProp("combobox-chip");return f.jsx("span",M({role:"option","aria-selected":t,"data-test-id":"lg-combobox-chip"},v.prop,{ref:o,className:we({darkMode:c,size:s}),onClick:function(e){var n;null!==(n=h.current)&&void 0!==n&&n.contains(e.target)||l()},tabIndex:-1}),f.jsx("span",{className:ke},x?f.jsx(C.default,{definition:r,align:"bottom"},x):r),f.jsx("button",{"aria-label":"Deselect ".concat(r),"aria-disabled":u,disabled:u,ref:h,className:Ce,onClick:function(){u||i()},onKeyDown:function(e){u||e.keyCode!==U.Delete&&e.keyCode!==U.Backspace&&e.keyCode!==U.Enter&&e.keyCode!==U.Space||i()}},f.jsx(y.default,{glyph:"X"})))}));je.displayName="Chip";var Ne,Oe,Me=function(e){var n=e.darkMode,o=e.size,r=e.overflow;return s.cx(function(e){return e?s.css(Q||(Q=S([""]))):s.css(Z||(Z=S(["\n        --lg-combobox-color-error: ",";\n        --lg-combobox-text-color: ",";\n        --lg-combobox-text-color-disabled: ",";\n\n        --lg-combobox-background-color: ",";\n        --lg-combobox-background-color-focus: ",";\n        --lg-combobox-background-color-disabled: ",";\n\n        --lg-combobox-border-color: ",";\n        --lg-combobox-border-color-disabled: ",";\n        --lg-combobox-border-color-error: ",";\n\n        --lg-combobox-shadow: 0px 1px 2px rgba(6, 22, 33, 0.3);\n        --lg-combobox-shadow-focus: 0px 4px 4px rgba(6, 22, 33, 0.3);\n      "])),u.uiColors.red.base,u.uiColors.gray.dark3,u.uiColors.gray.dark1,u.uiColors.gray.light3,u.uiColors.white,u.uiColors.gray.light2,u.uiColors.gray.base,u.uiColors.gray.light1,u.uiColors.red.base)}(n),function(e){switch(e){case"default":return s.css(ee||(ee=S(["\n          --lg-combobox-padding-y: 5px;\n          --lg-combobox-padding-x: 7px;\n          --lg-combobox-height: 24px;\n          --lg-combobox-font-size: 14px;\n          --lg-combobox-line-height: 20px;\n          --lg-combobox-border-radius: 3px;\n          --lg-combobox-input-default-width: 12ch;\n          --lg-combobox-icon-height: 16px;\n        "])))}}(o),s.css(ne||(ne=S(["\n      --lg-combobox-width: ",";\n      --lg-combobox-padding: var(--lg-combobox-padding-y)\n        var(--lg-combobox-padding-x) var(--lg-combobox-padding-y)\n        ",";\n      width: var(--lg-combobox-width);\n    "])),"expand-x"===r?"unset":"100%","scroll-x"===r?"0":"var(--lg-combobox-padding-x)"))},Ee=s.css(oe||(oe=S(["\n  display: flex;\n  flex-wrap: nowrap;\n  align-items: center;\n  padding: var(--lg-combobox-padding);\n  color: var(--lg-combobox-text-color);\n  background-color: var(--lg-combobox-background-color);\n  box-shadow: var(--lg-combobox-shadow);\n  border: 1px solid var(--lg-combobox-border-color);\n  border-radius: var(--lg-combobox-border-radius);\n  width: var(--lg-combobox-width);\n  cursor: text;\n  transition: 150ms ease-in-out;\n  transition-property: background-color, box-shadow;\n  min-width: 256px;\n\n  &:focus-within {\n    background-color: var(--lg-combobox-background-color-focus);\n    box-shadow: var(--lg-combobox-shadow-focus);\n  }\n\n  &[data-disabled='true'] {\n    color: var(--lg-combobox-text-color-disabled);\n    background-color: var(--lg-combobox-background-color-disabled);\n    border-color: var(--lg-combobox-border-color-disabled);\n    box-shadow: unset;\n    cursor: not-allowed;\n  }\n\n  &[data-state='error'] {\n    border-color: var(--lg-combobox-border-color-error);\n  }\n"]))),Se=s.css(re||(re=S(["\n  width: var(--lg-combobox-width);\n"]))),Ie=function(e){var n=e.state;return e.darkMode?{hovered:"error"===n?u.uiColors.red.dark2:void 0}:{hovered:"error"===n?u.uiColors.red.light3:void 0}},ze=function(e){var n,r=e.overflow,t=e.isOpen,i=e.selection,l=e.value,a=o.isArray(i)&&i.length>0,c=null!==(n=null==l?void 0:l.length)&&void 0!==n?n:0,u=a?t||c>0?"".concat(c+1,"ch"):"0":"var(--lg-combobox-input-default-width)",d=s.css(te||(te=S(["\n    flex-grow: 1;\n    width: var(--lg-combobox-width);\n\n    --lg-combobox-input-width: ",";\n  "])),u);switch(r){case"scroll-x":return s.css(ie||(ie=S(["\n        ","\n        display: block;\n        height: var(--lg-combobox-height);\n        white-space: nowrap;\n        overflow-x: scroll;\n        scroll-behavior: smooth;\n        scrollbar-width: none;\n        /*\n         * Immediate transition in, slow transition out. \n         * '-in' transition is handled by `scroll-behavior` \n         */\n        --lg-combobox-input-transition: width ease-in-out\n          ",";\n\n        &::-webkit-scrollbar {\n          display: none;\n        }\n\n        & > * {\n          margin-inline: 2px;\n\n          &:first-child {\n            margin-inline-start: var(--lg-combobox-padding-x);\n          }\n\n          &:last-child {\n            margin-inline-end: var(--lg-combobox-padding-x);\n          }\n        }\n      "],["\n        ","\n        display: block;\n        height: var(--lg-combobox-height);\n        white-space: nowrap;\n        overflow-x: scroll;\n        scroll-behavior: smooth;\n        scrollbar-width: none;\n        /*\n         * Immediate transition in, slow transition out. \n         * '-in' transition is handled by \\`scroll-behavior\\` \n         */\n        --lg-combobox-input-transition: width ease-in-out\n          ",";\n\n        &::-webkit-scrollbar {\n          display: none;\n        }\n\n        & > * {\n          margin-inline: 2px;\n\n          &:first-child {\n            margin-inline-start: var(--lg-combobox-padding-x);\n          }\n\n          &:last-child {\n            margin-inline-end: var(--lg-combobox-padding-x);\n          }\n        }\n      "])),d,t?"0":"100ms");case"expand-x":return s.css(le||(le=S(["\n        ","\n        display: flex;\n        gap: 4px;\n        flex-wrap: nowrap;\n        white-space: nowrap;\n        --lg-combobox-input-transition: width 150ms ease-in-out;\n      "])),d);case"expand-y":return s.css(ae||(ae=S(["\n        ","\n        display: flex;\n        flex-wrap: wrap;\n        gap: 4px;\n        overflow-x: visible;\n      "])),d)}},Ae=s.css(ce||(ce=S(["\n  border: none;\n  cursor: inherit;\n  background-color: inherit;\n  box-sizing: content-box;\n  padding-block: calc(\n    (var(--lg-combobox-height) - var(--lg-combobox-line-height)) / 2\n  );\n  padding-inline: 0;\n  height: var(--lg-combobox-line-height);\n  width: var(\n    --lg-combobox-input-width,\n    var(--lg-combobox-input-default-width, auto)\n  );\n  transition: var(--lg-combobox-input-transition);\n\n  &:focus {\n    outline: none;\n  }\n"]))),De=s.css(se||(se=S(["\n  // Add a negative margin so the button takes up the same space as the regular icons\n  margin-block: calc(var(--lg-combobox-icon-height) / 2 - 100%);\n"]))),Le=s.css(ue||(ue=S(["\n  font-size: var(--lg-combobox-font-size);\n  line-height: var(--lg-combobox-line-height);\n  color: var(--lg-combobox-color-error);\n  padding-top: var(--lg-combobox-padding-y);\n"]))),Pe=s.css(de||(de=S(["\n  margin-inline-end: calc(var(--lg-combobox-padding-x) / 2);\n"]))),Fe=s.keyframes(be||(be=S(["\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n"]))),Te=s.css(fe||(fe=S(["\n  animation: "," 1.5s linear infinite;\n"])),Fe),Re=function(e){var n,o,r=e.darkMode,t=e.size,i=e.width,l=void 0===i?384:i;switch(n=r?s.css(ge||(ge=S([""]))):s.css(pe||(pe=S(["\n      --lg-combobox-menu-color: ",";\n      --lg-combobox-menu-message-color: ",";\n      --lg-combobox-menu-background-color: ",";\n      --lg-combobox-menu-shadow: 0px 3px 7px rgba(0, 0, 0, 0.25);\n      --lg-combobox-item-hover-color: ",";\n      --lg-combobox-item-active-color: ",";\n      --lg-combobox-item-wedge-color: ",";\n    "])),u.uiColors.gray.dark3,u.uiColors.gray.dark1,u.uiColors.white,u.uiColors.gray.light2,u.uiColors.blue.light3,u.uiColors.blue.base),t){case"default":o=s.css(me||(me=S(["\n        --lg-combobox-menu-border-radius: 4px;\n        --lg-combobox-item-height: 36px;\n        --lg-combobox-item-padding-y: 8px;\n        --lg-combobox-item-padding-x: 12px;\n        --lg-combobox-item-font-size: 14px;\n        --lg-combobox-item-line-height: 21px;\n        --lg-combobox-item-wedge-height: 22px;\n      "])))}return s.cx(n,o,s.css(he||(he=S(["\n      width: ","px;\n      border-radius: var(--lg-combobox-menu-border-radius);\n\n      & > * {\n        border-radius: inherit;\n      }\n    "])),l))},qe=function(e){var n=e.maxHeight;return s.css(xe||(xe=S(["\n  position: relative;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  font-family: ",";\n  color: var(--lg-combobox-menu-color);\n  background-color: var(--lg-combobox-menu-background-color);\n  box-shadow: var(--lg-combobox-menu-shadow);\n  border-radius: inherit;\n  overflow: auto;\n  min-height: var(--lg-combobox-item-height);\n  max-height: ","px;\n  scroll-behavior: smooth;\n"])),p.fontFamilies.default,n)},Ge=s.css(ve||(ve=S(["\n  position: relative;\n  margin: 0;\n  padding: 0;\n"]))),We=s.css(ye||(ye=S(["\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-size: var(--lg-combobox-item-font-size);\n  color: var(--lg-combobox-menu-message-color);\n  padding: var(--lg-combobox-item-padding-y) var(--lg-combobox-item-padding-x);\n\n  & > svg {\n    width: 1em;\n    height: 1em;\n  }\n"]))),Be=function(e){return s.css(Ne||(Ne=S(["\n  --lg-combobox-group-label-color: ",";\n  --lg-combobox-group-border-color: ",";\n  padding-top: 8px;\n  border-bottom: 1px solid var(--lg-combobox-group-border-color);\n"])),e?u.uiColors.gray.light1:u.uiColors.gray.dark1,e?u.uiColors.gray.dark1:u.uiColors.gray.light1)},Ke=s.css(Oe||(Oe=S(["\n  cursor: default;\n  width: 100%;\n  padding: 0 12px 2px;\n  outline: none;\n  overflow-wrap: anywhere;\n  font-size: 12px;\n  line-height: 16px;\n  font-weight: bold;\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n  color: var(--lg-combobox-group-label-color);\n"])));function Ue(e){var o=e.label,r=e.className,t=e.children,l=n.useContext(K).darkMode,a=i.useIdAllocator({prefix:"combobox-group"});return h.default.Children.count(t)>0?f.jsx("div",{className:s.cx(Be(l),r)},f.jsx("div",{className:Ke,id:a},o),f.jsx("div",{role:"group","aria-labelledby":a},t)):f.jsx(h.default.Fragment,null)}function Ve(e){throw Error("`ComboboxGroup` must be a child of a `Combobox` instance")}Ve.displayName="ComboboxGroup";var He=["children","label","description","placeholder","aria-label","disabled","size","darkMode","state","errorMessage","searchState","searchEmptyMessage","searchErrorMessage","searchLoadingMessage","filteredOptions","onFilter","clearable","onClear","overflow","multiselect","initialValue","onChange","value","chipTruncationLocation","chipCharacterLimit","className"];e.Combobox=function(e){var t=e.children,l=e.label,a=e.description,c=e.placeholder,b=void 0===c?"Select":c,g=e["aria-label"],p=e.disabled,m=void 0!==p&&p,k=e.size,C=void 0===k?"default":k,j=e.darkMode,N=void 0!==j&&j,O=e.state,S=void 0===O?"none":O,z=e.errorMessage,A=e.searchState,D=void 0===A?"unset":A,L=e.searchEmptyMessage,P=void 0===L?"No results found":L,F=e.searchErrorMessage,T=void 0===F?"Could not get results!":F,R=e.searchLoadingMessage,q=void 0===R?"Loading results...":R,G=e.filteredOptions,W=e.onFilter,B=e.clearable,V=void 0===B||B,_=e.onClear,Y=e.overflow,J=void 0===Y?"expand-y":Y,Q=e.multiselect,Z=void 0!==Q&&Q,ee=e.initialValue,ne=e.onChange,oe=e.value,re=e.chipTruncationLocation,te=e.chipCharacterLimit,ie=void 0===te?12:te,le=e.className,ae=E(e,He),ce=i.useDynamicRefs({prefix:"option"}),se=i.useDynamicRefs({prefix:"chip"}),ue=i.useIdAllocator({prefix:"combobox-input"}),de=i.useIdAllocator({prefix:"combobox-label"}),be=i.useIdAllocator({prefix:"combobox-menu"}),fe=n.useRef(null),ge=n.useRef(null),pe=n.useRef(null),me=n.useRef(null),he=n.useRef(null),xe=I(n.useState(!1),2),ve=xe[0],ye=xe[1],we=i.usePrevious(ve),ke=I(n.useState(null),2),Ce=ke[0],Ne=ke[1],Oe=I(n.useState(null),2),Fe=Oe[0],Be=Oe[1],Ke=i.usePrevious(Fe),Ve=I(n.useState(""),2),Xe=Ve[0],_e=Ve[1],Ye=i.usePrevious(Xe),$e=I(n.useState(null),2),Je=$e[0],Qe=$e[1],Ze=!o.isNull(Fe)&&(o.isArray(Fe)&&Fe.length>0||o.isString(Fe)),en=n.useCallback((function(e){return Z&&o.isArray(e)}),[Z]),nn=n.useCallback((function(e){!m&&me&&me.current&&(me.current.focus(),o.isUndefined(e)||me.current.setSelectionRange(e,e))}),[m]),on=n.useCallback((function(e){if(en(Fe)){var n=o.clone(Fe);o.isNull(e)?n.length=0:Fe.includes(e)?n.splice(n.indexOf(e),1):(n.push(e),_e("")),Be(n),null==ne||ne(n)}else{var r=e;Be(r),null==ne||ne(r)}}),[en,ne,Fe]),rn=function(){pe&&pe.current&&(pe.current.scrollLeft=pe.current.scrollWidth)},tn=Z&&o.isArray(Fe)&&Fe.length>0?void 0:b,ln=n.useMemo((function(){return X(t)}),[t]),an=n.useCallback((function(e){var n,o;return e?null!==(n=null===(o=ln.find((function(n){return n.value===e})))||void 0===o?void 0:o.displayName)&&void 0!==n?n:e:""}),[ln]),cn=n.useCallback((function(e){var n="string"==typeof e?e:e.value;return G&&G.length>0?G.includes(n):("string"==typeof e?an(n):e.displayName).toLowerCase().includes(Xe.toLowerCase())}),[G,an,Xe]),sn=n.useMemo((function(){return ln.filter(cn)}),[ln,cn]),un=n.useCallback((function(e){return!!e&&!!ln.find((function(n){return n.value===e}))}),[ln]),dn=n.useCallback((function(e){return sn?sn.findIndex((function(n){return n.value===e})):-1}),[sn]),bn=n.useCallback((function(e){if(sn&&sn.length>=e){var n=sn[e];return n?n.value:void 0}}),[sn]),fn=n.useCallback((function(){return en(Fe)?Fe.findIndex((function(e){var n,o;return null===(n=se(e))||void 0===n||null===(o=n.current)||void 0===o?void 0:o.contains(document.activeElement)})):-1}),[se,en,Fe]),gn=n.useCallback((function(){var e,n,o,r=null===(e=me.current)||void 0===e?void 0:e.contains(document.activeElement),t=null===(n=ge.current)||void 0===n?void 0:n.contains(document.activeElement),i=en(Fe)&&Fe.some((function(e){var n,o;return null===(n=se(e))||void 0===n||null===(o=n.current)||void 0===o?void 0:o.contains(document.activeElement)})),l=function(){return en(Fe)?Fe.findIndex((function(e){var n,o;return null===(n=se(e))||void 0===n||null===(o=n.current)||void 0===o?void 0:o.contains(document.activeElement)})):-1};return en(Fe)&&i?0===l()?"FirstChip":l()===Fe.length-1?"LastChip":"MiddleChip":r?"Input":t?"ClearButton":null!==(o=fe.current)&&void 0!==o&&o.contains(document.activeElement)?"Combobox":void 0}),[se,en,Fe]),pn=n.useCallback((function(e){var n,o=null!==(n=null==sn?void 0:sn.length)&&void 0!==n?n:0,r=o-1>0?o-1:0,t=dn(Ce);switch(e&&ve&&(Qe(null),nn()),e){case"next":var i=bn(t+1<o?t+1:0);Ne(null!=i?i:null);break;case"prev":var l=bn(t-1>=0?t-1:r);Ne(null!=l?l:null);break;case"last":var a=bn(r);Ne(null!=a?a:null);break;case"first":default:var c=bn(0);Ne(null!=c?c:null)}}),[Ce,dn,bn,ve,nn,null==sn?void 0:sn.length]),mn=n.useCallback((function(e,n){if(en(Fe))switch(e){case"next":var o=null!=n?n:fn(),r=o+1<Fe.length?o+1:Fe.length-1,t=Fe[r];Qe(t);break;case"prev":var i=null!=n?n:fn(),l=i>0?i-1:i<0?Fe.length-1:0,a=Fe[l];Qe(a);break;case"first":var c=Fe[0];Qe(c);break;case"last":var s=Fe[Fe.length-1];Qe(s);break;default:Qe(null)}}),[fn,en,Fe]),hn=n.useCallback((function(e,n){e&&Ne(null);var o=gn();switch(e){case"right":switch(o){case"Input":var r,t,i;if((null===(r=me.current)||void 0===r?void 0:r.selectionEnd)===(null===(t=me.current)||void 0===t?void 0:t.value.length))null===(i=ge.current)||void 0===i||i.focus();break;case"LastChip":n.preventDefault(),nn(0),mn(null);break;case"FirstChip":case"MiddleChip":mn("next")}break;case"left":switch(o){case"ClearButton":var l;n.preventDefault(),nn(null==me||null===(l=me.current)||void 0===l?void 0:l.value.length);break;case"Input":case"MiddleChip":case"LastChip":if(en(Fe)){var a;if("Input"===o&&0!==(null===(a=me.current)||void 0===a?void 0:a.selectionStart))break;mn("prev")}}break;default:mn(null)}}),[gn,en,Fe,nn,mn]);n.useEffect((function(){Xe!==Ye&&pn("first")}),[Xe,ve,Ye,pn]),n.useEffect((function(){if(Ce){var e=ce(Ce);if(e&&e.current&&he.current){var n=e.current.offsetTop,o=he.current,r=o.scrollTop;(n>o.offsetHeight||n<r)&&(he.current.scrollTop=n)}}}),[Ce,ce]);var xn=n.useCallback((function(e){return h.default.Children.map(e,(function(e){if(d.isComponentType(e,"ComboboxOption")){var n=H(e.props),o=n.value,r=n.displayName;if(cn(o)){var t=e.props,i=t.className,l=t.glyph,a=ln.findIndex((function(e){return e.value===o})),c=Ce===o,s=en(Fe)?Fe.includes(o):Fe===o,u=ce(o);return f.jsx($,{value:o,displayName:r,isFocused:c,isSelected:s,setSelected:function(){Ne(o),on(o),nn(),o===Fe&&Nn()},glyph:l,className:i,index:a,ref:u})}}else if(d.isComponentType(e,"ComboboxGroup")){var b=xn(e.props.children);if(b&&(null==b?void 0:b.length)>0)return f.jsx(Ue,{label:e.props.label,className:e.props.className},xn(b))}}))}),[ln,Ce,ce,en,cn,Fe,nn,on]),vn=n.useMemo((function(){return xn(t)}),[t,xn]),yn=n.useMemo((function(){if(en(Fe))return Fe.filter(un).map((function(e,n){var o=an(e),r=Je===e,t=se(e);return f.jsx(je,{key:e,displayName:o,isFocused:r,onRemove:function(){mn("next",n),on(e)},onFocus:function(){Qe(e)},ref:t})}))}),[en,Fe,un,an,Je,se,mn,on]),wn=n.useMemo((function(){return f.jsx(h.default.Fragment,null,V&&Ze&&f.jsx(w.default,{"aria-label":"Clear selection","aria-disabled":m,disabled:m,ref:ge,onClick:function(e){m||(on(null),null==_||_(e),null==W||W(""),ve||On())},onFocus:Dn,className:De},f.jsx(y.default,{glyph:"XWithCircle"})),"error"===S?f.jsx(y.default,{glyph:"Warning",color:u.uiColors.red.base,className:Pe}):f.jsx(y.default,{glyph:"CaretDown",className:Pe}))}),[V,Ze,m,S,on,_,W,ve]),kn=n.useMemo((function(){return ln.some((function(e){return e.hasGlyph}))}),[ln]),Cn=n.useCallback((function(){if(!en(Fe)&&Fe===Ke){var e=sn.find((function(e){return e.displayName===Xe||e.value===Xe}));if(e&&!oe)Be(e.value);else{var n,o=null!==(n=an(Fe))&&void 0!==n?n:"";_e(o)}}}),[an,Xe,en,Ke,Fe,oe,sn]),jn=n.useCallback((function(){if(Ze){if(en(Fe))rn();else if(!en(Fe)){var e,n=null!==(e=an(Fe))&&void 0!==e?e:"";_e(n),Nn()}}else _e("")}),[Ze,an,en,Fe]);n.useEffect((function(){if(ee)if(o.isArray(ee)){var e,n=null!==(e=ee.filter((function(e){return un(e)})))&&void 0!==e?e:[];Be(n)}else un(ee)&&Be(ee);else Be(function(e){return e?[]:null}(Z))}),[]),n.useEffect((function(){if(!o.isUndefined(oe)&&oe!==Ye)if(o.isNull(oe))Be(null);else if(en(oe)){var e=oe.filter(un);Be(e)}else Be(un(oe)?oe:null)}),[en,un,Ye,oe]),n.useEffect((function(){Fe!==Ke&&jn()}),[jn,Ke,Fe]),n.useEffect((function(){ve||we===ve||Cn()}),[ve,we,Cn]);var Nn=function(){return ye(!1)},On=function(){return ye(!0)},Mn=I(n.useState(0),2),En=Mn[0],Sn=Mn[1];n.useEffect((function(){var e,n;Sn(null!==(e=null===(n=fe.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)}),[fe,ve,Ce,Fe]);var In=n.useMemo((function(){switch(D){case"loading":return f.jsx("span",{className:We},f.jsx(y.default,{glyph:"Refresh",color:u.uiColors.blue.base,className:Te}),q);case"error":return f.jsx("span",{className:We},f.jsx(y.default,{glyph:"Warning",color:u.uiColors.red.base}),T);case"unset":default:return vn&&vn.length>0?f.jsx("ul",{className:Ge},vn):f.jsx("span",{className:We},P)}}),[vn,P,T,q,D]),zn=i.useViewportSize(),An=n.useMemo((function(){if(zn&&fe.current&&he.current){var e=fe.current.getBoundingClientRect(),n=e.top,o=e.bottom,r=Math.max(zn.height-o,n);return Math.min(274,r-8)}return 274}),[zn,fe,he]);n.useEffect((function(){}),[Ce]);var Dn=function(){Ne(null)};return i.useEventListener("mousedown",(function(e){var n,o,r=e.target;(null===(n=he.current)||void 0===n?void 0:n.contains(r))||(null===(o=fe.current)||void 0===o?void 0:o.contains(r))||!1||ye(!1)})),f.jsx(K.Provider,{value:{multiselect:Z,darkMode:N,size:C,withIcons:kn,disabled:m,chipTruncationLocation:re,chipCharacterLimit:ie,inputValue:Xe}},f.jsx("div",M({className:s.cx(Me({darkMode:N,size:C,overflow:J}),le)},ae),f.jsx("div",null,l&&f.jsx(r.Label,{id:de,htmlFor:ue},l),a&&f.jsx(r.Description,null,a)),f.jsx(v.default,{className:Se,disabled:m,color:Ie({state:S,darkMode:N})},f.jsx("div",{ref:fe,role:"combobox","aria-expanded":ve,"aria-controls":be,"aria-owns":be,tabIndex:-1,className:Ee,onMouseDown:function(e){e.target!==me.current&&e.preventDefault()},onClick:function(e){if(e.target!==me.current){var n=0;if(me.current)n=e.nativeEvent.offsetX>me.current.offsetLeft+me.current.clientWidth?Xe.length:0;nn(n)}},onFocus:function(){rn(),On()},onKeyDown:function(e){var n,r,t=null===(n=he.current)||void 0===n?void 0:n.contains(document.activeElement);if((null===(r=fe.current)||void 0===r?void 0:r.contains(document.activeElement))||t){if(e.ctrlKey||e.shiftKey||e.altKey)return;var i=gn();switch(e.keyCode){case U.Tab:switch(i){case"Input":Ze||(Nn(),pn("first"),mn(null));break;case"LastChip":mn(null)}break;case U.Escape:Nn(),pn("first");break;case U.Enter:case U.Space:ve&&e.preventDefault(),document.activeElement===me.current&&ve&&!o.isNull(Ce)?on(Ce):document.activeElement===ge.current&&(on(null),nn());break;case U.Backspace:var l;en(Fe)&&0===(null===(l=me.current)||void 0===l?void 0:l.selectionStart)?mn("last"):On();break;case U.ArrowDown:ve&&e.preventDefault(),On(),pn("next");break;case U.ArrowUp:ve&&e.preventDefault(),pn("prev");break;case U.ArrowRight:hn("right",e);break;case U.ArrowLeft:hn("left",e);break;default:ve||On()}}},onTransitionEnd:function(){var e,n;Sn(null!==(e=null===(n=fe.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)},"data-disabled":m,"data-state":S},f.jsx("div",{ref:pe,className:ze({overflow:J,isOpen:ve,selection:Fe,value:Xe})},yn,f.jsx("input",{"aria-label":null!=g?g:l,"aria-autocomplete":"list","aria-controls":be,"aria-labelledby":de,ref:me,id:ue,className:Ae,placeholder:tn,disabled:null!=m?m:void 0,onChange:function(e){var n=e.target.value;_e(n),null==W||W(n)},value:Xe,autoComplete:"off"})),wn)),"error"===S&&z&&f.jsx("div",{className:Le},z),f.jsx(x.default,{active:ve&&!m,spacing:4,align:"bottom",justify:"middle",refEl:fe,adjustOnMutation:!0,className:Re({darkMode:N,size:C,width:En})},f.jsx("div",{id:be,role:"listbox","aria-labelledby":de,"aria-expanded":ve,ref:he,className:qe({maxHeight:An}),onMouseDownCapture:function(e){return e.preventDefault()}},In))))},e.ComboboxGroup=Ve,e.ComboboxOption=J,Object.defineProperty(e,"__esModule",{value:!0})}));
+//# sourceMappingURL=index.js.map