@leafygreen-ui/combobox 0.9.0 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/CHANGELOG.md +37 -0
  2. package/README.md +48 -41
  3. package/dist/Combobox.d.ts +1 -1
  4. package/dist/Combobox.d.ts.map +1 -1
  5. package/dist/Combobox.styles.d.ts.map +1 -1
  6. package/dist/Combobox.types.d.ts +23 -0
  7. package/dist/Combobox.types.d.ts.map +1 -1
  8. package/dist/ComboboxOption.d.ts.map +1 -1
  9. package/dist/esm/index.js +1 -1
  10. package/dist/esm/index.js.map +1 -1
  11. package/dist/index.js +1 -1
  12. package/dist/index.js.map +1 -1
  13. package/package.json +33 -30
  14. package/src/Chip.tsx +1 -1
  15. package/src/Combobox.spec.tsx +286 -124
  16. package/src/Combobox.story.tsx +10 -4
  17. package/src/Combobox.styles.ts +14 -24
  18. package/src/Combobox.tsx +37 -13
  19. package/src/Combobox.types.ts +28 -0
  20. package/src/ComboboxOption.tsx +7 -2
  21. package/tsconfig.tsbuildinfo +135 -47
package/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
- !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})}));
1
+ !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),v=m(t),x=m(l),y=m(a),w=m(c),C=m(b),k=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){M(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){return(O="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function M(e,n,o){return n in e?Object.defineProperty(e,n,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[n]=o,e}function E(){return(E=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 S(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 I(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function z(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)||P(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 A(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)||P(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 P(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,F,T,R,q,G,W,B,K,U,V=n.createContext({multiselect:!1,darkMode:!1,size:"default",withIcons:!1,disabled:!1}),H=N(N({},d.keyMap),{},{Backspace:8,Delete:46}),X=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)},Z=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:""}},_=function e(n){return h.default.Children.toArray(n).reduce((function(n,o){if(d.isComponentType(o,"ComboboxOption")){var r=Z(o.props),t=r.value,i=r.displayName,l=o.props.glyph;return[].concat(A(n),[{value:t,displayName:i,hasGlyph:!!l}])}if(d.isComponentType(o,"ComboboxGroup")){var a=o.props.children;if(a)return[].concat(A(n),A(e(a)))}}),[])},Y=s.css(F||(F=I(["\n display: inline-flex;\n gap: 8px;\n justify-content: start;\n align-items: inherit;\n"]))),$=s.css(T||(T=I(["\n pointer-events: none;\n"]))),J=function(e){return s.css(R||(R=I(["\n font-weight: ",";\n"])),e?"bold":"normal")},Q=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(V),m=p.multiselect,v=p.darkMode,x=p.withIcons,w=p.inputValue,k=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(C.default,{label:"","aria-labelledby":k,checked:l,tabIndex:-1,animate:!1});return f.jsx(h.default.Fragment,null,f.jsx("span",{className:s.cx(Y,$)},x?O:e,f.jsx("span",{id:k,className:J(l)},X(r,w,"strong"))),x&&e)}return f.jsx(h.default.Fragment,null,f.jsx("span",{className:s.cx(Y,$)},O,f.jsx("span",{className:J(l)},X(r,w,"strong"))),l&&f.jsx(y.default,{glyph:"Checkmark",color:v?u.uiColors.blue.light1:u.uiColors.blue.base}))}),[m,O,l,r,w,v,k,x]);return f.jsx("li",{ref:j,role:"option","aria-selected":c,"aria-label":r,tabIndex:-1,className:s.cx(s.css(L||(L=I(["\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 ee(e){throw Error("`ComboboxOption` must be a child of a `Combobox` instance")}Q.displayName="ComboboxOption",ee.displayName="ComboboxOption";var ne,oe,re,te,ie,le,ae,ce,se,ue,de,be,fe,ge,pe,me,he,ve,xe,ye,we,Ce,ke,je=function(e){var n,o,r=e.darkMode,t=e.size;switch(n=r?s.css(q||(q=I([""]))):s.css(G||(G=I(["\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(W||(W=I(["\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(B||(B=I(["\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 "]))))},Ne=s.css(K||(K=I(["\n padding-inline: var(--lg-combobox-chip-padding-x);\n"]))),Oe=s.css(U||(U=I(["\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"]))),Me=h.default.forwardRef((function(e,o){var r=e.displayName,t=e.isFocused,i=e.onRemove,l=e.onFocus,a=n.useContext(V),c=a.darkMode,s=a.size,u=a.disabled,b=a.chipTruncationLocation,g=void 0===b?"end":b,p=a.chipCharacterLimit,m=void 0===p?12:p,h=!!m&&!!g&&"none"!==g&&r.length>m,v=n.useRef(null),x=n.useMemo((function(){if(h){var e=m-3;switch(g){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}),[m,g,r,h]);n.useEffect((function(){var e;t&&!u&&(null==v||null===(e=v.current)||void 0===e||e.focus())}),[u,o,t]);var w=d.createDataProp("combobox-chip");return f.jsx("span",E({role:"option","aria-selected":t,"data-test-id":"lg-combobox-chip"},w.prop,{ref:o,className:je({darkMode:c,size:s}),onClick:function(e){var n;null!==(n=v.current)&&void 0!==n&&n.contains(e.target)||l()},tabIndex:-1}),f.jsx("span",{className:Ne},x?f.jsx(k.default,{definition:r,align:"bottom"},x):r),f.jsx("button",{"aria-label":"Deselect ".concat(r),"aria-disabled":u,disabled:u,ref:v,className:Oe,onClick:function(){u||i()},onKeyDown:function(e){u||e.keyCode!==H.Delete&&e.keyCode!==H.Backspace&&e.keyCode!==H.Enter&&e.keyCode!==H.Space||i()}},f.jsx(y.default,{glyph:"X"})))}));Me.displayName="Chip";var Ee,Se,Ie=function(e){var n=e.darkMode,o=e.size,r=e.overflow;return s.cx(function(e){return e?s.css(ne||(ne=I([""]))):s.css(oe||(oe=I(["\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(re||(re=I(["\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-icon-height: 16px;\n "])))}}(o),s.css(te||(te=I(["\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)"))},ze=s.css(ie||(ie=I(["\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"]))),Ae=s.css(le||(le=I(["\n width: var(--lg-combobox-width);\n"]))),Pe=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}},De=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=s.css(ae||(ae=I(["\n flex-grow: 1;\n width: var(--lg-combobox-width);\n\n --lg-combobox-input-width: ",";\n "])),a?"".concat(c,"ch"):"100%");switch(r){case"scroll-x":return s.css(ce||(ce=I(["\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:not(input) {\n margin-inline-start: 0;\n }\n\n &:last-child:not(input) {\n margin-inline-end: 0;\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:not(input) {\n margin-inline-start: 0;\n }\n\n &:last-child:not(input) {\n margin-inline-end: 0;\n }\n }\n "])),u,t?"0":"100ms");case"expand-x":return s.css(se||(se=I(["\n ","\n display: flex;\n gap: 4px;\n flex-wrap: nowrap;\n white-space: nowrap;\n height: var(--lg-combobox-height);\n --lg-combobox-input-transition: none;\n "])),u);case"expand-y":return s.css(ue||(ue=I(["\n ","\n display: flex;\n flex-wrap: wrap;\n gap: 4px;\n overflow-x: visible;\n min-height: var(--lg-combobox-height);\n "])),u)}},Le=s.css(de||(de=I(["\n border: none;\n cursor: inherit;\n background-color: inherit;\n box-sizing: content-box;\n padding: 0;\n margin: 0;\n text-overflow: ellipsis;\n line-height: var(--lg-combobox-line-height);\n height: var(--lg-combobox-height);\n width: var(--lg-combobox-input-width, 0);\n transition: var(--lg-combobox-input-transition);\n\n &:focus {\n outline: none;\n }\n"]))),Fe=s.css(be||(be=I(["\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"]))),Te=s.css(fe||(fe=I(["\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"]))),Re=s.css(ge||(ge=I(["\n margin-inline-end: calc(var(--lg-combobox-padding-x) / 2);\n"]))),qe=s.keyframes(pe||(pe=I(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"]))),Ge=s.css(me||(me=I(["\n animation: "," 1.5s linear infinite;\n"])),qe),We=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(he||(he=I([""]))):s.css(ve||(ve=I(["\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(xe||(xe=I(["\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(ye||(ye=I(["\n width: ","px;\n border-radius: var(--lg-combobox-menu-border-radius);\n\n & > * {\n border-radius: inherit;\n }\n "])),l))},Be=function(e){var n=e.maxHeight;return s.css(we||(we=I(["\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)},Ke=s.css(Ce||(Ce=I(["\n position: relative;\n margin: 0;\n padding: 0;\n"]))),Ue=s.css(ke||(ke=I(["\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"]))),Ve=function(e){return s.css(Ee||(Ee=I(["\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)},He=s.css(Se||(Se=I(["\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 Xe(e){var o=e.label,r=e.className,t=e.children,l=n.useContext(V).darkMode,a=i.useIdAllocator({prefix:"combobox-group"});return h.default.Children.count(t)>0?f.jsx("div",{className:s.cx(Ve(l),r)},f.jsx("div",{className:He,id:a},o),f.jsx("div",{role:"group","aria-labelledby":a},t)):f.jsx(h.default.Fragment,null)}function Ze(e){throw Error("`ComboboxGroup` must be a child of a `Combobox` instance")}Ze.displayName="ComboboxGroup";var _e=["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","usePortal","portalClassName","portalContainer","scrollContainer","popoverZIndex"];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,C=e.size,k=void 0===C?"default":C,j=e.darkMode,M=void 0!==j&&j,I=e.state,A=void 0===I?"none":I,P=e.errorMessage,D=e.searchState,L=void 0===D?"unset":D,F=e.searchEmptyMessage,T=void 0===F?"No results found":F,R=e.searchErrorMessage,q=void 0===R?"Could not get results!":R,G=e.searchLoadingMessage,W=void 0===G?"Loading results...":G,B=e.filteredOptions,K=e.onFilter,U=e.clearable,X=void 0===U||U,Y=e.onClear,$=e.overflow,J=void 0===$?"expand-y":$,ee=e.multiselect,ne=void 0!==ee&&ee,oe=e.initialValue,re=e.onChange,te=e.value,ie=e.chipTruncationLocation,le=e.chipCharacterLimit,ae=void 0===le?12:le,ce=e.className,se=e.usePortal,ue=void 0===se||se,de=e.portalClassName,be=e.portalContainer,fe=e.scrollContainer,ge=e.popoverZIndex,pe=S(e,_e),me=i.useDynamicRefs({prefix:"option"}),he=i.useDynamicRefs({prefix:"chip"}),ve=i.useIdAllocator({prefix:"combobox-input"}),xe=i.useIdAllocator({prefix:"combobox-label"}),ye=i.useIdAllocator({prefix:"combobox-menu"}),we=n.useRef(null),Ce=n.useRef(null),ke=n.useRef(null),je=n.useRef(null),Ne=n.useRef(null),Oe=z(n.useState(!1),2),Ee=Oe[0],Se=Oe[1],qe=i.usePrevious(Ee),Ve=z(n.useState(null),2),He=Ve[0],Ze=Ve[1],Ye=z(n.useState(null),2),$e=Ye[0],Je=Ye[1],Qe=i.usePrevious($e),en=z(n.useState(""),2),nn=en[0],on=en[1],rn=i.usePrevious(nn),tn=z(n.useState(null),2),ln=tn[0],an=tn[1],cn=!o.isNull($e)&&(o.isArray($e)&&$e.length>0||o.isString($e)),sn=n.useCallback((function(e){return!ne||"string"!=typeof e&&"number"!=typeof e?!ne&&o.isArray(e)&&d.consoleOnce.error("Error in Combobox: multiselect is set to `false`, but recieved an Array value"):d.consoleOnce.error("Error in Combobox: multiselect is set to `true`, but recieved a ".concat(O(e),' value: "').concat(e,'"')),ne&&o.isArray(e)}),[ne]),un=n.useCallback((function(e){!m&&je&&je.current&&(je.current.focus(),o.isUndefined(e)||je.current.setSelectionRange(e,e))}),[m]),dn=n.useCallback((function(e){if(sn($e)){var n=o.clone($e);o.isNull(e)?n.length=0:$e.includes(e)?n.splice(n.indexOf(e),1):(n.push(e),on("")),Je(n),null==re||re(n)}else{var r=e;Je(r),null==re||re(r)}}),[sn,re,$e]),bn=function(){ke&&ke.current&&(ke.current.scrollLeft=ke.current.scrollWidth)},fn=ne&&o.isArray($e)&&$e.length>0?void 0:b,gn=n.useMemo((function(){return _(t)}),[t]),pn=n.useCallback((function(e){var n,o;return e?null!==(n=null===(o=gn.find((function(n){return n.value===e})))||void 0===o?void 0:o.displayName)&&void 0!==n?n:e:""}),[gn]),mn=n.useCallback((function(e){var n="string"==typeof e?e:e.value;return B&&B.length>0?B.includes(n):("string"==typeof e?pn(n):e.displayName).toLowerCase().includes(nn.toLowerCase())}),[B,pn,nn]),hn=n.useMemo((function(){return gn.filter(mn)}),[gn,mn]),vn=n.useCallback((function(e){return!!e&&!!gn.find((function(n){return n.value===e}))}),[gn]),xn=n.useCallback((function(e){return hn?hn.findIndex((function(n){return n.value===e})):-1}),[hn]),yn=n.useCallback((function(e){if(hn&&hn.length>=e){var n=hn[e];return n?n.value:void 0}}),[hn]),wn=n.useCallback((function(){return sn($e)?$e.findIndex((function(e){var n,o;return null===(n=he(e))||void 0===n||null===(o=n.current)||void 0===o?void 0:o.contains(document.activeElement)})):-1}),[he,sn,$e]),Cn=n.useCallback((function(){var e,n,o,r=null===(e=je.current)||void 0===e?void 0:e.contains(document.activeElement),t=null===(n=Ce.current)||void 0===n?void 0:n.contains(document.activeElement),i=sn($e)&&$e.some((function(e){var n,o;return null===(n=he(e))||void 0===n||null===(o=n.current)||void 0===o?void 0:o.contains(document.activeElement)})),l=function(){return sn($e)?$e.findIndex((function(e){var n,o;return null===(n=he(e))||void 0===n||null===(o=n.current)||void 0===o?void 0:o.contains(document.activeElement)})):-1};return sn($e)&&i?0===l()?"FirstChip":l()===$e.length-1?"LastChip":"MiddleChip":r?"Input":t?"ClearButton":null!==(o=we.current)&&void 0!==o&&o.contains(document.activeElement)?"Combobox":void 0}),[he,sn,$e]),kn=n.useCallback((function(e){var n,o=null!==(n=null==hn?void 0:hn.length)&&void 0!==n?n:0,r=o-1>0?o-1:0,t=xn(He);switch(e&&Ee&&(an(null),un()),e){case"next":var i=yn(t+1<o?t+1:0);Ze(null!=i?i:null);break;case"prev":var l=yn(t-1>=0?t-1:r);Ze(null!=l?l:null);break;case"last":var a=yn(r);Ze(null!=a?a:null);break;case"first":default:var c=yn(0);Ze(null!=c?c:null)}}),[He,xn,yn,Ee,un,null==hn?void 0:hn.length]),jn=n.useCallback((function(e,n){if(sn($e))switch(e){case"next":var o=null!=n?n:wn(),r=o+1<$e.length?o+1:$e.length-1,t=$e[r];an(t);break;case"prev":var i=null!=n?n:wn(),l=i>0?i-1:i<0?$e.length-1:0,a=$e[l];an(a);break;case"first":var c=$e[0];an(c);break;case"last":var s=$e[$e.length-1];an(s);break;default:an(null)}}),[wn,sn,$e]),Nn=n.useCallback((function(e,n){e&&Ze(null);var o=Cn();switch(e){case"right":switch(o){case"Input":var r,t,i;if((null===(r=je.current)||void 0===r?void 0:r.selectionEnd)===(null===(t=je.current)||void 0===t?void 0:t.value.length))null===(i=Ce.current)||void 0===i||i.focus();break;case"LastChip":n.preventDefault(),un(0),jn(null);break;case"FirstChip":case"MiddleChip":jn("next")}break;case"left":switch(o){case"ClearButton":var l;n.preventDefault(),un(null==je||null===(l=je.current)||void 0===l?void 0:l.value.length);break;case"Input":case"MiddleChip":case"LastChip":if(sn($e)){var a;if("Input"===o&&0!==(null===(a=je.current)||void 0===a?void 0:a.selectionStart))break;jn("prev")}}break;default:jn(null)}}),[Cn,sn,$e,un,jn]);n.useEffect((function(){nn!==rn&&kn("first")}),[nn,Ee,rn,kn]),n.useEffect((function(){if(He){var e=me(He);if(e&&e.current&&Ne.current){var n=e.current.offsetTop,o=Ne.current,r=o.scrollTop;(n>o.offsetHeight||n<r)&&(Ne.current.scrollTop=n)}}}),[He,me]);var On=n.useCallback((function(e){return h.default.Children.map(e,(function(e){if(d.isComponentType(e,"ComboboxOption")){var n=Z(e.props),o=n.value,r=n.displayName;if(mn(o)){var t=e.props,i=t.className,l=t.glyph,a=gn.findIndex((function(e){return e.value===o})),c=He===o,s=sn($e)?$e.includes(o):$e===o,u=me(o);return f.jsx(Q,{value:o,displayName:r,isFocused:c,isSelected:s,setSelected:function(){Ze(o),dn(o),un(),o===$e&&Pn()},glyph:l,className:i,index:a,ref:u})}}else if(d.isComponentType(e,"ComboboxGroup")){var b=On(e.props.children);if(b&&(null==b?void 0:b.length)>0)return f.jsx(Xe,{label:e.props.label,className:e.props.className},On(b))}}))}),[gn,He,me,sn,mn,$e,un,dn]),Mn=n.useMemo((function(){return On(t)}),[t,On]),En=n.useMemo((function(){if(sn($e))return $e.filter(vn).map((function(e,n){var o=pn(e),r=ln===e,t=he(e);return f.jsx(Me,{key:e,displayName:o,isFocused:r,onRemove:function(){jn("next",n),dn(e)},onFocus:function(){an(e)},ref:t})}))}),[sn,$e,vn,pn,ln,he,jn,dn]),Sn=n.useMemo((function(){return f.jsx(h.default.Fragment,null,X&&cn&&f.jsx(w.default,{"aria-label":"Clear selection","aria-disabled":m,disabled:m,ref:Ce,onClick:function(e){m||(dn(null),null==Y||Y(e),null==K||K(""),Ee||Dn())},onFocus:Wn,className:Fe},f.jsx(y.default,{glyph:"XWithCircle"})),"error"===A?f.jsx(y.default,{glyph:"Warning",color:u.uiColors.red.base,className:Re}):f.jsx(y.default,{glyph:"CaretDown",className:Re}))}),[X,cn,m,A,dn,Y,K,Ee]),In=n.useMemo((function(){return gn.some((function(e){return e.hasGlyph}))}),[gn]),zn=n.useCallback((function(){if(!sn($e)&&$e===Qe){var e=hn.find((function(e){return e.displayName===nn||e.value===nn}));if(e&&!te)Je(e.value);else{var n,o=null!==(n=pn($e))&&void 0!==n?n:"";on(o)}}}),[pn,nn,sn,Qe,$e,te,hn]),An=n.useCallback((function(){if(cn){if(sn($e))bn();else if(!sn($e)){var e,n=null!==(e=pn($e))&&void 0!==e?e:"";on(n),Pn()}}else on("")}),[cn,pn,sn,$e]);n.useEffect((function(){if(oe)if(o.isArray(oe)){var e,n=null!==(e=oe.filter((function(e){return vn(e)})))&&void 0!==e?e:[];Je(n)}else vn(oe)&&Je(oe);else Je(function(e){return e?[]:null}(ne))}),[]),n.useEffect((function(){if(!o.isUndefined(te)&&te!==rn)if(o.isNull(te))Je(null);else if(sn(te)){var e=te.filter(vn);Je(e)}else Je(vn(te)?te:null)}),[sn,vn,rn,te]),n.useEffect((function(){o.isEqual($e,Qe)||An()}),[An,Qe,$e]),n.useEffect((function(){Ee||qe===Ee||zn()}),[Ee,qe,zn]);var Pn=function(){return Se(!1)},Dn=function(){return Se(!0)},Ln=z(n.useState(0),2),Fn=Ln[0],Tn=Ln[1];n.useEffect((function(){var e,n;Tn(null!==(e=null===(n=we.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)}),[we,Ee,He,$e]);var Rn=n.useMemo((function(){switch(L){case"loading":return f.jsx("span",{className:Ue},f.jsx(y.default,{glyph:"Refresh",color:u.uiColors.blue.base,className:Ge}),W);case"error":return f.jsx("span",{className:Ue},f.jsx(y.default,{glyph:"Warning",color:u.uiColors.red.base}),q);case"unset":default:return Mn&&Mn.length>0?f.jsx("ul",{className:Ke},Mn):f.jsx("span",{className:Ue},T)}}),[Mn,T,q,W,L]),qn=i.useViewportSize(),Gn=n.useMemo((function(){if(qn&&we.current&&Ne.current){var e=we.current.getBoundingClientRect(),n=e.top,o=e.bottom,r=Math.max(qn.height-o,n);return Math.min(274,r-8)}return 274}),[qn,we,Ne]);n.useEffect((function(){}),[He]);var Wn=function(){Ze(null)};i.useEventListener("mousedown",(function(e){var n,o,r=e.target;(null===(n=Ne.current)||void 0===n?void 0:n.contains(r))||(null===(o=we.current)||void 0===o?void 0:o.contains(r))||!1||Se(!1)}));var Bn=N({popoverZIndex:ge},ue?{usePortal:ue,portalClassName:de,portalContainer:be,scrollContainer:fe}:{usePortal:ue});return f.jsx(V.Provider,{value:{multiselect:ne,darkMode:M,size:k,withIcons:In,disabled:m,chipTruncationLocation:ie,chipCharacterLimit:ae,inputValue:nn}},f.jsx("div",E({className:s.cx(Ie({darkMode:M,size:k,overflow:J}),ce)},pe),f.jsx("div",null,l&&f.jsx(r.Label,{id:xe,htmlFor:ve},l),a&&f.jsx(r.Description,null,a)),f.jsx(x.default,{className:Ae,disabled:m,color:Pe({state:A,darkMode:M})},f.jsx("div",{ref:we,role:"combobox","aria-expanded":Ee,"aria-controls":ye,"aria-owns":ye,tabIndex:-1,className:ze,onMouseDown:function(e){m&&e.preventDefault()},onClick:function(e){if(e.target!==je.current){var n=0;if(je.current)n=e.nativeEvent.offsetX>je.current.offsetLeft+je.current.clientWidth?nn.length:0;un(n)}},onFocus:function(){bn(),Dn()},onKeyDown:function(e){var n,r,t=null===(n=Ne.current)||void 0===n?void 0:n.contains(document.activeElement);if((null===(r=we.current)||void 0===r?void 0:r.contains(document.activeElement))||t){if(e.ctrlKey||e.shiftKey||e.altKey)return;var i=Cn();switch(e.keyCode){case H.Tab:switch(i){case"Input":cn||(Pn(),kn("first"),jn(null));break;case"LastChip":jn(null)}break;case H.Escape:Pn(),kn("first");break;case H.Enter:document.activeElement===je.current&&Ee&&!o.isNull(He)?dn(He):document.activeElement===Ce.current&&(dn(null),un());break;case H.Backspace:var l;sn($e)&&0===(null===(l=je.current)||void 0===l?void 0:l.selectionStart)?jn("last"):Dn();break;case H.ArrowDown:Ee&&e.preventDefault(),Dn(),kn("next");break;case H.ArrowUp:Ee&&e.preventDefault(),kn("prev");break;case H.ArrowRight:Nn("right",e);break;case H.ArrowLeft:Nn("left",e);break;default:Ee||Dn()}}},onTransitionEnd:function(){var e,n;Tn(null!==(e=null===(n=we.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)},"data-disabled":m,"data-state":A},f.jsx("div",{ref:ke,className:De({overflow:J,isOpen:Ee,selection:$e,value:nn})},En,f.jsx("input",{"aria-label":null!=g?g:l,"aria-autocomplete":"list","aria-controls":ye,"aria-labelledby":xe,ref:je,id:ve,className:Le,placeholder:fn,disabled:null!=m?m:void 0,onChange:function(e){var n=e.target.value;on(n),null==K||K(n)},value:nn,autoComplete:"off"})),Sn)),"error"===A&&P&&f.jsx("div",{className:Te},P),f.jsx(v.default,E({active:Ee&&!m,spacing:4,align:"bottom",justify:"middle",refEl:we,adjustOnMutation:!0,className:We({darkMode:M,size:k,width:Fn})},Bn),f.jsx("div",{id:ye,role:"listbox","aria-labelledby":xe,"aria-expanded":Ee,ref:Ne,className:Be({maxHeight:Gn}),onMouseDownCapture:function(e){return e.preventDefault()}},Rn))))},e.ComboboxGroup=Ze,e.ComboboxOption=ee,Object.defineProperty(e,"__esModule",{value:!0})}));
2
2
  //# sourceMappingURL=index.js.map