@leafygreen-ui/combobox 12.2.0 → 12.3.0
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.
- package/CHANGELOG.md +35 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/types/Combobox/Combobox.types.d.ts +2 -2
- package/dist/types/Combobox/Combobox.types.d.ts.map +1 -1
- package/dist/types/Combobox/index.d.ts +1 -1
- package/dist/types/Combobox/index.d.ts.map +1 -1
- package/dist/types/index.d.ts +1 -1
- package/dist/types/index.d.ts.map +1 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/index.js.map +1 -1
- package/package.json +14 -14
- package/src/Combobox/Combobox.types.ts +3 -1
- package/src/Combobox/index.ts +1 -0
- package/src/index.ts +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,40 @@
|
|
|
1
1
|
# @leafygreen-ui/combobox
|
|
2
2
|
|
|
3
|
+
## 12.3.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- c7d6e62: Export `RenderMode` enum
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- cb31ce6: fix: remove unexpected @emotion imports from icon package dependency
|
|
12
|
+
- Updated dependencies [43810b4]
|
|
13
|
+
- Updated dependencies [ec4fad8]
|
|
14
|
+
- Updated dependencies [cb31ce6]
|
|
15
|
+
- @leafygreen-ui/icon@14.7.1
|
|
16
|
+
- @leafygreen-ui/tokens@4.1.0
|
|
17
|
+
- @leafygreen-ui/chip@4.0.10
|
|
18
|
+
- @leafygreen-ui/form-field@4.0.8
|
|
19
|
+
- @leafygreen-ui/icon-button@17.1.4
|
|
20
|
+
- @leafygreen-ui/typography@22.2.3
|
|
21
|
+
- @leafygreen-ui/checkbox@18.1.4
|
|
22
|
+
- @leafygreen-ui/input-option@4.1.4
|
|
23
|
+
|
|
24
|
+
## 12.2.1
|
|
25
|
+
|
|
26
|
+
### Patch Changes
|
|
27
|
+
|
|
28
|
+
- 9cf3b18: Updates provider peer dependency version string to correctly use `pnpm` `workspace` syntax
|
|
29
|
+
- Updated dependencies [9cf3b18]
|
|
30
|
+
- @leafygreen-ui/input-option@4.1.3
|
|
31
|
+
- @leafygreen-ui/icon-button@17.1.3
|
|
32
|
+
- @leafygreen-ui/form-field@4.0.7
|
|
33
|
+
- @leafygreen-ui/typography@22.2.2
|
|
34
|
+
- @leafygreen-ui/checkbox@18.1.3
|
|
35
|
+
- @leafygreen-ui/popover@14.3.1
|
|
36
|
+
- @leafygreen-ui/chip@4.0.9
|
|
37
|
+
|
|
3
38
|
## 12.2.0
|
|
4
39
|
|
|
5
40
|
### Minor Changes
|
package/dist/esm/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e,{createContext as n,useContext as r,useEffect as t,useMemo as o,useCallback as i,useRef as a,useState as l}from"react";import c from"lodash/clone";import u from"lodash/debounce";import s from"lodash/isArray";import d from"lodash/isEqual";import f from"lodash/isNull";import p from"lodash/isString";import h from"lodash/isUndefined";import{css as m,cx as g,keyframes as b}from"@leafygreen-ui/emotion";import{FormFieldState as v,DEFAULT_MESSAGES as y,FormFieldFeedback as x}from"@leafygreen-ui/form-field";import{useForwardedRef as w,useIdAllocator as k,useAvailableSpace as E,useDynamicRefs as C,usePrevious as S,useAutoScroll as L,useBackdropClick as N}from"@leafygreen-ui/hooks";import{Icon as D,isComponentGlyph as O}from"@leafygreen-ui/icon";import{IconButton as M}from"@leafygreen-ui/icon-button";import I,{useDarkMode as z,PopoverPropsProvider as j}from"@leafygreen-ui/leafygreen-provider";import{createUniqueClassName as W,keyMap as A,Theme as F,isComponentType as T,consoleOnce as X}from"@leafygreen-ui/lib";import{Popover as P,RenderMode as R,getPopoverRenderModeProps as G,DismissMode as B}from"@leafygreen-ui/popover";import{Error as H,Label as V,Description as K}from"@leafygreen-ui/typography";import{transparentize as Y}from"polished";import{palette as U}from"@leafygreen-ui/palette";import{typeScales as Z,spacing as q,fontWeights as $,boxShadows as J,fontFamilies as Q,color as _,transitionDuration as ee,focusRing as ne}from"@leafygreen-ui/tokens";import{chipTextClassName as re,TruncationLocation as te,Chip as oe,BaseFontSize as ie,Variant as ae}from"@leafygreen-ui/chip";export{TruncationLocation}from"@leafygreen-ui/chip";import le from"lodash/kebabCase";import{descriptionClassName as ce,titleClassName as ue,leftGlyphClassName as se,InputOption as de,InputOptionContent as fe}from"@leafygreen-ui/input-option";import{Checkbox as pe}from"@leafygreen-ui/checkbox";import he from"lodash/escapeRegExp";function me(e,n){(null==n||n>e.length)&&(n=e.length);for(var r=0,t=Array(n);r<n;r++)t[r]=e[r];return t}function ge(e,n,r){return(n=function(e){var n=function(e,n){if("object"!=typeof e||!e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var t=r.call(e,n);if("object"!=typeof t)return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e,"string");return"symbol"==typeof n?n:n+""}(n))in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function be(){return be=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)({}).hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},be.apply(null,arguments)}function ve(e,n){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n&&(t=t.filter(function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable})),r.push.apply(r,t)}return r}function ye(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?ve(Object(r),!0).forEach(function(n){ge(e,n,r[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ve(Object(r)).forEach(function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))})}return e}function xe(e,n){if(null==e)return{};var r,t,o=function(e,n){if(null==e)return{};var r={};for(var t in e)if({}.hasOwnProperty.call(e,t)){if(-1!==n.indexOf(t))continue;r[t]=e[t]}return r}(e,n);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(t=0;t<i.length;t++)r=i[t],-1===n.indexOf(r)&&{}.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function we(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var t,o,i,a,l=[],c=!0,u=!1;try{if(i=(r=r.call(e)).next,0===n);else for(;!(c=(t=i.call(r)).done)&&(l.push(t.value),l.length!==n);c=!0);}catch(e){u=!0,o=e}finally{try{if(!c&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(u)throw o}}return l}}(e,n)||Se(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 ke(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function Ee(e){return function(e){if(Array.isArray(e))return me(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||Se(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 Ce(e){return Ce="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},Ce(e)}function Se(e,n){if(e){if("string"==typeof e)return me(e,n);var r={}.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?me(e,n):void 0}}var Le="Input",Ne="ClearButton",De="FirstChip",Oe="LastChip",Me="MiddleChip",Ie="Combobox",ze="Menu",je={XSmall:"xsmall",Small:"small",Default:"default",Large:"large"},We={expandY:"expand-y",scrollX:"scroll-x",expandX:"expand-x"},Ae=v,Fe={Unset:"unset",Error:"error",Loading:"loading"},Te={Trigger:"trigger",Option:"option"};var Xe,Pe,Re,Ge,Be,He,Ve,Ke,Ye,Ue=n({multiselect:!1,size:je.Default,withIcons:!1,disabled:!1,isOpen:!1,state:Ae.None,searchState:Fe.Unset,overflow:We.expandY}),Ze=W("combobox-chip"),qe=ge(ge(ge(ge({},je.XSmall,16),je.Small,Z.body1.lineHeight),je.Default,Z.body1.lineHeight),je.Large,Z.body2.lineHeight),$e=ge(ge(ge(ge({},je.XSmall,Z.body1.fontSize),je.Small,Z.body1.fontSize),je.Default,Z.body1.fontSize),je.Large,Z.body2.fontSize),Je=ge(ge(ge(ge({},je.XSmall,1),je.Small,0),je.Default,2),je.Large,4),Qe=ge(ge(ge(ge({},je.XSmall,m(Xe||(Xe=ke(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),$e[je.XSmall],qe[je.XSmall],re,Je[je.XSmall])),je.Small,m(Pe||(Pe=ke(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),$e[je.Small],qe[je.Small],re,Je[je.Small])),je.Default,m(Re||(Re=ke(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),$e[je.Default],qe[je.Default],re,Je[je.Default])),je.Large,m(Ge||(Ge=ke(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-inline-end: 10px;\n padding-block: ","px;\n }\n "])),$e[je.Large],qe[je.Large],re,Je[je.Large])),_e=e.forwardRef(function(n,o){var i,a=n.displayName,l=n.isFocused,c=n.onRemove,u=n.onFocus,s=r(Ue),d=s.size,f=s.disabled,p=s.overflow,h=s.chipTruncationLocation,m=void 0===h?te.End:h,b=s.chipCharacterLimit,v=void 0===b?12:b,y=p===We.scrollX?te.None:m,x=w(o,null),k=null===(i=x.current)||void 0===i?void 0:i.querySelector("button");t(function(){l&&!f&&(null==k||k.focus())},[f,k,l]);return e.createElement(oe,{label:a,className:g(Ze,Qe[d]),role:"option","aria-selected":l,"data-testid":"lg-combobox-chip",onClick:function(e){null!=k&&k.contains(e.target)||u()},onKeyDown:function(e){f||e.key!==A.Delete&&e.key!==A.Backspace&&e.key!==A.Enter&&e.key!==A.Space||c()},onDismiss:function(){f||c()},baseFontSize:ie.Body1,chipCharacterLimit:v,chipTruncationLocation:y,variant:ae.Gray,ref:x,disabled:f,tabIndex:-1})});_e.displayName="ComboboxChip";var en,nn,rn,tn,on,an,ln,cn,un,sn,dn,fn,pn,hn,mn,gn=ge(ge({},F.Light,m(Be||(Be=ke(["\n padding-top: ","px;\n "])),q[2])),F.Dark,m(He||(He=ke(["\n padding-top: ","px;\n "])),q[2])),bn=m(Ve||(Ve=ke(["\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: ",";\n text-transform: uppercase;\n letter-spacing: 0.4px;\n"])),$.semiBold),vn=ge(ge({},F.Light,m(Ke||(Ke=ke(["\n color: ",";\n "])),U.gray.dark1)),F.Dark,m(Ye||(Ye=ke(["\n color: ",";\n "])),U.gray.light1));function yn(n){var r=n.label,t=n.className,o=n.children,i=z().theme,a=k({prefix:"combobox-group"});return e.Children.count(o)>0?e.createElement("div",{className:g(gn[i],t)},e.createElement("div",{className:g(bn,vn[i]),id:a},r),e.createElement("div",{role:"group","aria-labelledby":a},o)):e.createElement(e.Fragment,null)}function xn(e){throw Error("`ComboboxGroup` must be a child of a `Combobox` instance")}xn.displayName="ComboboxGroup";var wn=ge(ge(ge(ge({},je.XSmall,{x:12,y:8}),je.Small,{x:12,y:8}),je.Default,{x:12,y:8}),je.Large,{x:12,y:8}),kn=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:384;return m(en||(en=ke(["\n width: ","px;\n overflow: hidden;\n border-radius: 12px;\n border: 1px solid;\n"])),e)},En=ge(ge({},F.Light,m(nn||(nn=ke(["\n box-shadow: ",";\n border-color: ",";\n "])),J[F.Light][1],U.gray.light2)),F.Dark,m(rn||(rn=ke(["\n box-shadow: ",";\n border-color: ",";\n "])),J[F.Dark][1],U.gray.dark2)),Cn=m(tn||(tn=ke(["\n width: max-content;\n"]))),Sn=m(on||(on=ke(["\n position: relative;\n width: 100%;\n margin: 0;\n padding: ","px 0;\n font-family: ",";\n border-radius: inherit;\n overflow-y: auto;\n scroll-behavior: smooth;\n"])),q[2],Q.default);ge(ge({},F.Light,m(an||(an=ke(["\n color: ",";\n background-color: ",";\n "])),U.black,U.white)),F.Dark,m(ln||(ln=ke(["\n color: ",";\n background-color: ",";\n "])),U.gray.light1,U.gray.dark3));var Ln,Nn=function(e){return m(cn||(cn=ke(["\n background-color: ",";\n"])),_[e].background.primary.default)},Dn=m(un||(un=ke(["\n position: relative;\n margin: 0;\n padding: 0;\n"]))),On=m(sn||(sn=ke(["\n font-family: inherit;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"]))),Mn=ge(ge({},F.Light,m(dn||(dn=ke(["\n color: ",";\n "])),U.gray.dark3)),F.Dark,m(fn||(fn=ke(["\n color: ",";\n "])),U.gray.light3)),In=function(e){return m(pn||(pn=ke(["\n font-size: ","px;\n line-height: ","px;\n padding: ","px ","px;\n"])),$e[e],qe[e],wn[e].y,wn[e].x)},zn=b(hn||(hn=ke(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"]))),jn=m(mn||(mn=ke(["\n animation: "," 1.5s linear infinite;\n"])),zn),Wn=e.forwardRef(function(n,t){var i=n.children,a=n.id,l=n.refEl,c=n.labelId,u=n.menuWidth,s=n.searchLoadingMessage,d=n.searchErrorMessage,f=n.searchEmptyMessage,p=n.dropdownWidthBasis,b=void 0===p?Te.Trigger:p,v=z(),y=v.darkMode,x=v.theme,k=r(Ue),C=k.disabled,S=k.size,L=k.isOpen,N=k.searchState,O=w(t,null),M=E(l),I=h(M)?"unset":"".concat(Math.min(M,256),"px"),j=o(function(){var n=g(On,Mn[x],In(S)),r=g(On,In(S));switch(N){case"loading":return e.createElement("span",{className:n},e.createElement(D,{glyph:"Refresh",color:y?U.blue.light1:U.blue.base,className:jn}),s);case"error":return e.createElement(H,{className:r},e.createElement(D,{glyph:"Warning",color:y?U.red.light1:U.red.base}),e.createElement("span",null,d));default:return i&&"object"===Ce(i)&&"length"in i&&i.length>0?e.createElement("ul",{className:Dn},i):e.createElement("span",{className:n},f)}},[x,S,N,y,s,d,i,f]);return e.createElement(P,{active:L&&!C,spacing:4,align:"bottom",justify:"middle",refEl:l,adjustOnMutation:!0,className:g(kn(u),En[x],ge({},Cn,b===Te.Option))},e.createElement("div",{ref:O,id:a,role:"listbox","aria-labelledby":c,"aria-expanded":L,className:g(Sn,Nn(x),m(Ln||(Ln=ke(["\n max-height: ",";\n "])),I)),onMouseDownCapture:function(e){return e.preventDefault()}},j))});Wn.displayName="ComboboxMenu";var An,Fn,Tn,Xn,Pn,Rn,Gn,Bn,Hn,Vn,Kn,Yn,Un,Zn,qn,$n,Jn,Qn,_n,er,nr=function(e){var n=e.scrollHeight;return e.scrollTop<n-e.clientHeight},rr=function(e){var n,r=e.value,t=e.displayName;return{value:null!=r?r:le(t),displayName:null!==(n=null!=t?t:r)&&void 0!==n?n:""}},tr=function(n){return e.Children.toArray(n).reduce(function(e,n){if(T(n,"ComboboxOption")){var r=rr(n.props),t=r.value,o=r.displayName,i=n.props,a=i.glyph,l=i.disabled;return[].concat(Ee(e),[{value:t,displayName:o,isDisabled:!!l,hasGlyph:!!a}])}if(T(n,"ComboboxGroup")){var c=n.props.children;if(c)return[].concat(Ee(e),Ee(tr(c)))}},[])},or=function(e,n){if(e)return n.find(function(n){return n.value===e})},ir=function(e,n){var r,t;return e?null!==(r=null===(t=or(e,n))||void 0===t?void 0:t.displayName)&&void 0!==r?r:e:""},ar=m(An||(An=ke(["\n .",", ."," {\n font-size: ","px;\n line-height: 20px;\n }\n"])),ce,ue,Z.body2.fontSize),lr=ge(ge(ge(ge({},je.XSmall,m(Fn||(Fn=ke(["\n min-width: ","px;\n "])),q[3])),je.Small,m(Tn||(Tn=ke(["\n min-width: ","px;\n "])),q[3])),je.Default,m(Xn||(Xn=ke(["\n min-width: ","px;\n "])),q[3])),je.Large,m(Pn||(Pn=ke(["\n min-width: ","px;\n "])),q[4])),cr=m(Rn||(Rn=ke(["\n pointer-events: none;\n gap: 0;\n\n label {\n gap: 0;\n align-items: center;\n }\n"])));m(Gn||(Gn=ke(["\n pointer-events: none;\n"])));var ur=function(e){return m(Bn||(Bn=ke(["\n font-weight: ",";\n"])),e?$.semiBold:$.regular)},sr=ge(ge({},F.Light,m(Hn||(Hn=ke(["\n color: ",";\n "])),U.gray.dark1)),F.Dark,m(Vn||(Vn=ke(["\n color: ",";\n "])),U.gray.base)),dr=ge(ge({},F.Light,m(Kn||(Kn=ke(["\n color: ",";\n "])),U.blue.dark1)),F.Dark,m(Yn||(Yn=ke(["\n color: ",";\n "])),U.blue.light3)),fr=ge(ge({},F.Light,m(Un||(Un=ke(["\n color: ",";\n "])),U.gray.light1)),F.Dark,m(Zn||(Zn=ke(["\n color: ",";\n "])),U.gray.dark1)),pr=ge(ge({},F.Light,m(qn||(qn=ke(["\n color: ",";\n "])),U.blue.base)),F.Dark,m($n||($n=ke(["\n color: ",";\n "])),U.blue.light1)),hr=ge(ge({},F.Light,m(Jn||(Jn=ke(["\n color: ",";\n "])),U.gray.light1)),F.Dark,m(Qn||(Qn=ke(["\n color: ",";\n "])),U.gray.dark1)),mr=m(_n||(_n=ke(["\n ."," {\n align-self: baseline;\n position: relative;\n // aligns the checkbox with the option name\n top: 1px;\n }\n"])),se),gr=m(er||(er=ke(["\n ."," {\n // aligns the checkbox with the option name\n top: 3px;\n }\n"])),se),br=["glyph","isSelected","displayName","isFocused","setSelected","className","description","value","onClick","disabled"],vr=e.forwardRef(function(n,t){var a=n.glyph,l=n.isSelected,c=n.displayName,u=n.isFocused,s=n.setSelected,d=n.className,f=n.description,p=n.value,h=n.onClick,m=n.disabled,b=void 0!==m&&m,v=xe(n,br),y=z(),x=y.darkMode,E=y.theme,C=r(Ue),S=C.multiselect,L=C.size,N=C.withIcons,M=C.inputValue,I=w(t,null),j=k({prefix:"combobox-option-text"}),W=i(function(e){e.stopPropagation(),b||(s(),null==h||h(e,p))},[b,h,s,p]),A=o(function(){return function(n){var r=n.withIcons,t=n.isSelected,o=n.glyph,i=n.optionTextId,a=n.disabled,l=n.darkMode,c=n.size,u=n.multiselect,s=n.theme,d=n.isFocused;o&&!O(o)&&console.error("`ComboboxOption` instance did not render icon because it is not a known glyph element.",o);var f=o&&O(o)?e.cloneElement(o,ye(ye({},o.props),{},{className:g(sr[s],ge(ge({},dr[s],d),fr[s],a),o.props.className)})):e.createElement(e.Fragment,null),p=e.createElement(pe,{"aria-labelledby":i,checked:t,tabIndex:-1,disabled:a,darkMode:l,className:cr}),h=e.createElement(D,{glyph:"Checkmark",className:g(lr[c],pr[s],ge({},hr[s],a))});return{leftGlyph:u?r?f:p:r?f:t?h:null,rightGlyph:u?r&&p:r&&t&&h}}({withIcons:N,isSelected:l,glyph:a,theme:E,darkMode:x,size:L,disabled:b,multiselect:S,optionTextId:j,isFocused:u})},[x,b,a,l,S,j,L,E,N,u]),F=A.leftGlyph,T=A.rightGlyph,X=S&&!N;return e.createElement(de,be({},v,{as:"li",ref:I,highlighted:u,disabled:b,"aria-label":c,darkMode:x,className:g(ge(ge(ge({},ar,L===je.Large),mr,X),gr,X&&L===je.Large),d),onClick:W,onKeyDown:W}),e.createElement(fe,{leftGlyph:F,rightGlyph:T,description:f},e.createElement("span",{id:j,className:ur(l)},function(n,r,t){if(r&&t){var o=he(r),i=new RegExp(o,"gi"),a=n.matchAll(i);if(a){for(var l=n.split(""),c=0,u=Array.from(a);c<u.length;c++){var s,d=u[c],f=null!==(s=d.index)&&void 0!==s?s:-1,p=d[0],h=p.length,m=f+p+h,g=new Array(h).fill("");g[0]=e.createElement(t,{key:m},p),l.splice.apply(l,[f,h].concat(Ee(g)))}return e.createElement(e.Fragment,null,l)}return e.createElement(e.Fragment,null,n)}return e.createElement(e.Fragment,null,n)}(c,M,"strong"))))});function yr(e){throw Error("`ComboboxOption` must be a child of a `Combobox` instance")}vr.displayName="ComboboxOption",yr.displayName="ComboboxOption";var xr,wr,kr,Er,Cr,Sr,Lr,Nr,Dr,Or,Mr,Ir,zr,jr,Wr,Ar,Fr,Tr,Xr,Pr,Rr,Gr,Br,Hr,Vr,Kr,Yr,Ur,Zr,qr,$r,Jr,Qr,_r=function(e){return!h(e)&&!f(e)&&(p(e)||s(e)&&e.length>0)},et=function(e){return qe[e]+2*Je[e]},nt=q[100],rt=ge(ge(ge(ge({},je.XSmall,22),je.Small,28),je.Default,36),je.Large,48),tt=function(e){return(rt[e]-et(e)-2)/2},ot=ge(ge(ge(ge({},je.XSmall,{y:tt(je.XSmall),xLeftWithChip:q[25],xLeftWithoutChip:q[200],xRight:q[100]}),je.Small,{y:tt(je.Small),xLeftWithChip:q[100],xLeftWithoutChip:q[200],xRight:q[100]}),je.Default,{y:tt(je.Default),xLeftWithChip:q[150],xLeftWithoutChip:q[300],xRight:q[200]}),je.Large,{y:tt(je.Large),xLeftWithChip:q[300],xLeftWithoutChip:q[300],xRight:q[200]}),it=q[400],at=function(e){return m(xr||(xr=ke(["\n font-family: ",";\n width: 100%;\n min-width: ","px;\n "])),Q.default,$e[e]+2*ot[e].xLeftWithChip+it+2)},lt=m(wr||(wr=ke(["\n display: flex;\n align-items: center;\n gap: ","px;\n cursor: text;\n transition: ","ms ease-in-out;\n transition-property: background-color, box-shadow, border-color;\n border: 1px solid;\n width: 100%;\n max-width: 100%;\n border-radius: 6px;\n position: relative;\n overflow: hidden;\n\n // Overflow shadow\n ::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 20px;\n bottom: -21px;\n left: 50%;\n translate: -50% 0%;\n border-radius: 20%;\n box-shadow: 0 0 0 0 rgb(255 255 255 / 0%);\n transition: ","ms linear;\n transition-property: box-shadow;\n }\n"])),q[200],ee.default,ee.default),ct=ge(ge({},F.Light,m(kr||(kr=ke(["\n color: ",";\n background-color: ",";\n "])),_.light.text.primary.default,_.light.background.primary.default)),F.Dark,m(Er||(Er=ke(["\n color: ",";\n background-color: ",";\n "])),_.dark.text.primary.default,U.gray.dark4)),ut=function(e,n){return m(Cr||(Cr=ke(["\n padding-top: ","px;\n padding-bottom: ","px;\n padding-left: ",";\n padding-right: ","px;\n"])),ot[e].y,ot[e].y,"".concat(n?ot[e].xLeftWithChip:ot[e].xLeftWithoutChip,"px"),ot[e].xRight)},st=function(e){return m(Sr||(Sr=ke(["\n cursor: not-allowed;\n color: ",";\n background-color: ",";\n border-color: ",";\n"])),_[e].text.disabled.default,_[e].background.disabled.default,_[e].border.disabled.default)},dt=function(e){return ge(ge(ge({},Ae.Error,m(Lr||(Lr=ke(["\n border-color: ",";\n "])),_[e].border.error.default)),Ae.None,m(Nr||(Nr=ke(["\n border-color: ",";\n "])),_[e].border.primary.default)),Ae.Valid,m(Dr||(Dr=ke(["\n border-color: ",";\n "])),_[e].border.success.default))},ft=ge(ge({},F.Light,m(Or||(Or=ke(["\n &:focus-within {\n border-color: transparent;\n box-shadow: ",";\n }\n "])),ne[F.Light].input)),F.Dark,m(Mr||(Mr=ke(["\n &:focus-within {\n border-color: transparent;\n box-shadow: ",";\n }\n "])),ne[F.Dark].input)),pt=m(Ir||(Ir=ke(["\n display: flex;\n align-items: center;\n"]))),ht=ge(ge(ge(ge({},je.XSmall,m(zr||(zr=ke(["\n gap: ","px;\n "])),q[100])),je.Small,m(jr||(jr=ke(["\n gap: ","px;\n "])),q[200])),je.Default,m(Wr||(Wr=ke(["\n gap: ","px;\n "])),q[200])),je.Large,m(Ar||(Ar=ke(["\n gap: ","px;\n "])),q[200])),mt=function(e){var n=e.overflow,r=e.size,t=m(Fr||(Fr=ke(["\n flex-grow: 1;\n width: 100%;\n "])));switch(n){case We.scrollX:return m(Tr||(Tr=ke(["\n ","\n display: block;\n height: ","px;\n white-space: nowrap;\n overflow-x: scroll;\n scroll-behavior: smooth;\n scrollbar-width: none;\n line-height: 1;\n\n &::-webkit-scrollbar {\n display: none;\n }\n\n & > ."," {\n margin-inline: 2px;\n\n &:first-child {\n margin-inline-start: 0;\n }\n\n &:last-child {\n margin-inline-end: 0;\n }\n }\n "])),t,et(r),Ze);case We.expandY:return m(Xr||(Xr=ke(["\n ","\n display: flex;\n flex-wrap: wrap;\n gap: ","px;\n overflow-x: hidden;\n min-height: ","px;\n max-height: calc((","px) + (","px * 2));\n "])),t,nt,et(r),3*et(r),nt)}},gt=m(Pr||(Pr=ke(["\n font-family: ",";\n width: 100%;\n border: none;\n cursor: inherit;\n background-color: inherit;\n color: inherit;\n box-sizing: content-box;\n padding: 0;\n margin: 0;\n text-overflow: ellipsis;\n vertical-align: top;\n\n // Only add padding if there are chips\n &:not(:first-child) {\n padding-left: ","px;\n }\n\n &:placeholder-shown {\n min-width: 100%;\n }\n &:focus {\n outline: none;\n }\n"])),Q.default,q[100]),bt=ge(ge({},F.Light,m(Rr||(Rr=ke(["\n &::placeholder {\n color: ",";\n }\n "])),U.gray.base)),F.Dark,m(Gr||(Gr=ke(["\n &::placeholder {\n color: ",";\n }\n "])),U.gray.dark1)),vt=ge(ge({},F.Light,m(Br||(Br=ke(["\n &::placeholder {\n color: ",";\n }\n "])),U.gray.base)),F.Dark,m(Hr||(Hr=ke(["\n &::placeholder {\n color: ",";\n }\n "])),U.gray.dark1)),yt=function(e){return m(Vr||(Vr=ke(["\n height: ","px;\n font-size: ","px;\n line-height: ","px;\n min-width: ","px;\n"])),et(e),$e[e],qe[e],$e[e])},xt=function(e){return m(Kr||(Kr=ke(["\n /*\n * Immediate transition in, slow transition out. \n * '-in' transition is handled by `scroll-behavior` \n */\n transition: width ease-in-out ",";\n"],["\n /*\n * Immediate transition in, slow transition out. \n * '-in' transition is handled by \\`scroll-behavior\\` \n */\n transition: width ease-in-out ",";\n"])),e?"0s":"100ms")},wt=function(e,n){var r,t=null!==(r=null==n?void 0:n.length)&&void 0!==r?r:0;return m(Yr||(Yr=ke(["\n width: ","px;\n max-width: 100%;\n "])),t*$e[e])},kt=m(Ur||(Ur=ke(["\n // Add a negative margin so the button takes up the same space as the regular icons\n margin-block: calc(","px - 100%);\n margin-inline: -6px;\n"])),it/2),Et=m(Zr||(Zr=ke(["\n height: ","px;\n width: ","px;\n"])),it,it),Ct=m(qr||(qr=ke(["\n margin-bottom: ","px;\n display: flex;\n flex-direction: column;\n"])),q[100]),St=m($r||($r=ke(["\n font-size: ","px;\n line-height: ","px;\n"])),Z.large.fontSize,Z.large.lineHeight),Lt=ge(ge({},F.Light,m(Jr||(Jr=ke(["\n ::after {\n box-shadow: 0px 0px 7px 5px ",";\n }\n "])),Y(.85,U.black))),F.Dark,m(Qr||(Qr=ke(["\n ::after {\n width: 95%;\n box-shadow: 0px -7px 12px 5px rgb(0 0 0 / 50%);\n }\n "])))),Nt=function(e){return _[e].icon.primary.default},Dt=function(e){return _[e].icon.disabled.default},Ot=["children","label","description","placeholder","aria-label","disabled","size","darkMode","state","errorMessage","successMessage","searchState","searchEmptyMessage","searchErrorMessage","searchLoadingMessage","filteredOptions","onFilter","clearable","onClear","overflow","multiselect","initialValue","inputValue","onInputChange","onChange","value","chipTruncationLocation","chipCharacterLimit","className","renderMode","portalClassName","portalContainer","portalRef","scrollContainer","popoverZIndex","dropdownWidthBasis"],Mt=["className","glyph","disabled"];function It(n){var r=n.children,m=n.label,b=n.description,v=n.placeholder,w=void 0===v?"Select":v,E=n["aria-label"],O=n.disabled,W=void 0!==O&&O,F=n.size,P=void 0===F?je.Default:F,H=n.darkMode,Y=n.state,U=void 0===Y?"none":Y,Z=n.errorMessage,q=void 0===Z?y.error:Z,$=n.successMessage,J=void 0===$?y.success:$,Q=n.searchState,_=void 0===Q?"unset":Q,ee=n.searchEmptyMessage,ne=void 0===ee?"No results found":ee,re=n.searchErrorMessage,te=void 0===re?"Could not get results!":re,oe=n.searchLoadingMessage,ie=void 0===oe?"Loading results...":oe,ae=n.filteredOptions,le=n.onFilter,ce=n.clearable,ue=void 0===ce||ce,se=n.onClear,de=n.overflow,fe=void 0===de?We.expandY:de,pe=n.multiselect,he=void 0!==pe&&pe,me=n.initialValue,ve=n.inputValue,ke=n.onInputChange,Ee=n.onChange,Se=n.value,Ae=n.chipTruncationLocation,Fe=n.chipCharacterLimit,Xe=void 0===Fe?12:Fe,Pe=n.className,Re=n.renderMode,Ge=void 0===Re?R.TopLayer:Re,Be=n.portalClassName,He=n.portalContainer,Ve=n.portalRef,Ke=n.scrollContainer,Ye=n.popoverZIndex,Ze=n.dropdownWidthBasis,qe=void 0===Ze?Te.Trigger:Ze,$e=xe(n,Ot),Je=z(H),Qe=Je.darkMode,en=Je.theme,nn=C({prefix:"option"}),rn=C({prefix:"chip"}),tn=k({prefix:"combobox-input"}),on=k({prefix:"combobox-label"}),an=k({prefix:"combobox-menu"}),ln=a(null),cn=a(null),un=a(null),sn=a(null),dn=a(null),fn=we(l(!1),2),pn=fn[0],hn=fn[1],mn=S(pn),gn=we(l(null),2),bn=gn[0],vn=gn[1],xn=we(l(null),2),wn=xn[0],kn=xn[1],En=S(wn),Cn=we(l(null!=ve?ve:""),2),Sn=Cn[0],Ln=Cn[1];t(function(){h(ve)||Ln(ve)},[ve]);var Nn=function(e){Ln(e)},Dn=S(Sn),On=we(l(null),2),Mn=On[0],In=On[1],zn=we(l(!1),2),jn=zn[0],An=zn[1],Fn=he&&s(wn)&&wn.length>0?void 0:w,Tn=function(){return hn(!1)},Xn=function(){return hn(!0)},Pn=o(function(){return tr(r)},[r]),Rn=i(function(e){return!he||"string"!=typeof e&&"number"!=typeof e?!he&&s(e)&&X.error("Error in Combobox: multiselect is set to `false`, but received an Array value"):X.error("Error in Combobox: multiselect is set to `true`, but received a ".concat(Ce(e),' value: "').concat(e,'"')),he&&s(e)},[he]),Gn=i(function(e){!W&&sn&&sn.current&&(sn.current.focus(),h(e)||sn.current.setSelectionRange(e,e))},[W]),Bn=i(function(e){if(Rn(wn)){var n=c(wn),r=Ee,t={diffType:"delete",value:null!=e?e:wn};f(e)?n.length=0:wn.includes(e)?n.splice(n.indexOf(e),1):(n.push(e),t.diffType="insert",Nn("")),kn(n),null==r||r(n,t)}else{var o=e,i=Ee;kn(o),null==i||i(o)}},[Rn,Ee,wn]),Hn=i(function(e){var n,r,t,o;return function(e,n){return Array.isArray(n)?n.includes(e):e===n}((r=Pn,(n=e)?null!==(t=null===(o=r.find(function(e){return e.displayName===n}))||void 0===o?void 0:o.value)&&void 0!==t?t:n:""),wn)},[Pn,wn]),Vn=i(function(e){var n="string"==typeof e?e:e.value;return ae&&ae.length>0?ae.includes(n):!!Hn(Sn)||("string"==typeof e?ir(n,Pn):e.displayName).toLowerCase().includes(Sn.toLowerCase())},[ae,Hn,Sn,Pn]),Kn=o(function(){return Pn.filter(Vn)},[Pn,Vn]),Yn=i(function(e){return!!e&&!!Pn.find(function(n){return n.value===e})},[Pn]),Un=i(function(e){return Kn?Kn.findIndex(function(n){return n.value===e}):-1},[Kn]),Zn=i(function(e){if(Kn&&Kn.length>=e){var n=Kn[e];return n?n.value:void 0}},[Kn]),qn=i(function(){return Rn(wn)?wn.findIndex(function(e){var n;return null===(n=rn(e))||void 0===n||null===(n=n.current)||void 0===n?void 0:n.contains(document.activeElement)}):-1},[rn,Rn,wn]),$n=we(l(),2),Jn=$n[0],Qn=$n[1],_n=i(function(e){var n,r=null!==(n=null==Kn?void 0:Kn.length)&&void 0!==n?n:0,t=r-1>0?r-1:0,o=Un(bn);switch(e&&pn&&(In(null),Gn()),e){case"next":var i=Zn(o+1<r?o+1:0);vn(null!=i?i:null);break;case"prev":var a=Zn(o-1>=0?o-1:t);vn(null!=a?a:null);break;case"last":var l=Zn(t);vn(null!=l?l:null);break;default:var c=Zn(0);vn(null!=c?c:null)}},[bn,Un,Zn,pn,Gn,null==Kn?void 0:Kn.length]),er=i(function(e,n){if(Rn(wn))switch(e){case"next":var r=null!=n?n:qn(),t=r+1<wn.length?r+1:wn.length-1,o=wn[t];In(o);break;case"prev":var i=null!=n?n:qn(),a=i>0?i-1:i<0?wn.length-1:0,l=wn[a];In(l);break;case"first":var c=wn[0];In(c);break;case"last":var u=wn[wn.length-1];In(u);break;default:In(null)}},[qn,Rn,wn]),ar=i(function(e,n){switch(e&&vn(null),e){case"right":switch(Jn){case Le:var r,t,o;if((null===(r=sn.current)||void 0===r?void 0:r.selectionEnd)===(null===(t=sn.current)||void 0===t?void 0:t.value.length))null===(o=cn.current)||void 0===o||o.focus();break;case De:case Me:case Oe:if(Jn===Oe||1===(null==wn?void 0:wn.length)){Gn(0),er(null),n.preventDefault();break}er("next")}break;case"left":switch(Jn){case Ne:var i;n.preventDefault(),Gn(null==sn||null===(i=sn.current)||void 0===i?void 0:i.value.length);break;case Le:case Me:case Oe:if(Rn(wn)){var a;if(Jn===Le&&0!==(null===(a=sn.current)||void 0===a?void 0:a.selectionStart))break;er("prev")}}break;default:er(null)}},[Jn,Rn,wn,Gn,er]);t(function(){pn||_n("first")},[pn,_n]),L(bn?nn(bn):void 0,dn);var lr=i(function(n){if(T(n,"ComboboxOption")){var r=rr(n.props),t=r.value,o=r.displayName;if(Vn(t)){var i=n.props,a=i.className,l=i.glyph,c=i.disabled,u=xe(i,Mt),s=Pn.findIndex(function(e){return e.value===t}),d=bn===t,f=Rn(wn)?wn.includes(t):wn===t,p=nn(t);return e.createElement(vr,be({},u,{value:t,displayName:o,isFocused:d,isSelected:f,disabled:c,setSelected:function(){vn(t),Bn(t),Gn(),t===wn&&Tn()},glyph:l,className:a,index:s,ref:p}))}}else if(T(n,"ComboboxGroup")){var h=e.Children.map(n.props.children,lr);if(h&&(null==h?void 0:h.length)>0)return e.createElement(yn,{label:n.props.label,className:n.props.className},e.Children.map(h,lr))}},[Pn,nn,bn,Rn,wn,Gn,Vn,Bn]),cr=o(function(){return e.Children.map(r,lr)},[r,lr]),ur=o(function(){if(Rn(wn))return wn.filter(Yn).map(function(n,r){var t=ir(n,Pn),o=Mn===n,i=rn(n),a=r>=wn.length-1;return e.createElement(_e,{key:n,displayName:t,isFocused:o,onRemove:function(){a?(Gn(),er(null)):er("next",r),Bn(n)},onFocus:function(){In(n)},ref:i})})},[Rn,wn,Yn,Pn,Mn,rn,Bn,Gn,er]),sr=o(function(){return Pn.some(function(e){return e.hasGlyph})},[Pn]),dr=i(function(){var e=Kn.find(function(e){return e.displayName===Sn||e.value===Sn});if(!Se&&e)Bn(e.value);else if(!Rn(wn)){var n,r=null!==(n=ir(wn,Pn))&&void 0!==n?n:En;Nn(r)}},[Pn,Sn,Rn,En,wn,Bn,Se,Kn]),fr=i(function(){if(_r(wn)){if(Rn(wn))Er(fe);else if(!Rn(wn)){var e,n=null!==(e=ir(wn,Pn))&&void 0!==e?e:"";Nn(n),Tn()}}else Nn("")},[Pn,Rn,wn,fe]);t(function(){if(me)if(s(me)){var e,n=null!==(e=me.filter(function(e){return Yn(e)}))&&void 0!==e?e:[];kn(n)}else Yn(me)&&kn(me);else kn(function(e){return e?[]:null}(he))},[]),t(function(){if(!h(Se)&&Se!==Dn)if(f(Se))kn(null);else if(Rn(Se)){var e=Se.filter(Yn);kn(e)}else kn(Yn(Se)?Se:null)},[Rn,Yn,Dn,Se]),t(function(){!h(En)&&(s(wn)&&!f(En)||p(wn)||f(wn))&&!d(wn,En)&&fr()},[fr,En,wn]),t(function(){!pn&&mn&&dr()},[pn,mn,dr]);var pr=we(l(0),2),hr=pr[0],mr=pr[1];t(function(){var e,n;mr(null!==(e=null===(n=ln.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)},[ln,pn,bn,wn]);N(Tn,[dn,ln],{enabled:pn});var gr=Rn(wn)&&!!wn.length,br=u(function(e){An(nr(e.target))},50,{leading:!0}),yr=i(function(e){fe===We.expandY&&br(e)},[br,fe]);t(function(){un.current&&An(nr(un.current))},[]);var xr,wr=ye({popoverZIndex:Ye},G({dismissMode:B.Manual,portalClassName:Be,portalContainer:He,portalRef:Ve,renderMode:Ge,scrollContainer:Ke})),kr={disabled:W,errorMessage:q,size:P,state:U,successMessage:J};return e.createElement(I,{darkMode:Qe},e.createElement(Ue.Provider,{value:{multiselect:he,size:P,withIcons:sr,disabled:W,isOpen:pn,state:U,searchState:_,chipTruncationLocation:Ae,chipCharacterLimit:Xe,inputValue:Sn,overflow:fe,popoverZIndex:Ye}},e.createElement("div",be({className:g(at(P),Pe)},$e),(m||b)&&e.createElement("div",{className:Ct},m&&e.createElement(V,{id:on,htmlFor:tn,darkMode:Qe,disabled:W,className:g(ge({},St,P===je.Large))},m),b&&e.createElement(K,{darkMode:Qe,disabled:W,className:g(ge({},St,P===je.Large))},b)),e.createElement("div",{ref:ln,role:"combobox","aria-expanded":pn,"aria-controls":an,"aria-owns":an,tabIndex:-1,onMouseDown:function(e){W&&e.preventDefault()},onClick:function(e){if(e.target!==sn.current){var n=0;if(sn.current)n=e.nativeEvent.offsetX>sn.current.offsetLeft+sn.current.clientWidth?Sn.length:0;Gn(n)}Xn()},onFocus:function(e){Er(fe),Qn(function(e){var n,r,t,o;if(!e)return;if(null!==(n=sn.current)&&void 0!==n&&n.contains(e))return Le;if(null!==(r=cn.current)&&void 0!==r&&r.contains(e))return Ne;var i=Rn(wn)?wn.findIndex(function(n){var r;return null===(r=rn(n))||void 0===r||null===(r=r.current)||void 0===r?void 0:r.contains(e)}):-1;if(Rn(wn)){if(0===i)return De;if(i===wn.length-1)return Oe;if(i>0)return Me}if(null!==(t=dn.current)&&void 0!==t&&t.contains(e))return ze;if(null!==(o=ln.current)&&void 0!==o&&o.contains(e))return Ie}(e.target))},onKeyDown:function(e){var n,r,t=null===(n=dn.current)||void 0===n?void 0:n.contains(document.activeElement);if((null===(r=ln.current)||void 0===r?void 0:r.contains(document.activeElement))||t){if(e.ctrlKey||e.shiftKey||e.altKey)return;switch(e.key){case A.Tab:switch(Jn){case"Input":_r(wn)||(Tn(),_n("first"),er(null));break;case"LastChip":er(null)}break;case A.Escape:Tn(),_n("first");break;case A.Enter:pn?!pn||Jn!==Le||f(bn)||function(e){if("string"==typeof e){var n=or(e,Pn);return!(null==n||!n.isDisabled)}return!!e.isDisabled}(bn)?Jn===Ne&&(Bn(null),Gn()):Bn(bn):Xn();break;case A.Backspace:var o;if(Rn(wn))"Input"===Jn&&0===(null===(o=sn.current)||void 0===o?void 0:o.selectionStart)&&er("last");Xn();break;case A.ArrowDown:pn?(e.preventDefault(),_n("next")):Xn();break;case A.ArrowUp:pn?(e.preventDefault(),_n("prev")):Xn();break;case A.ArrowRight:ar("right",e);break;case A.ArrowLeft:ar("left",e);break;default:pn||Xn()}}},onTransitionEnd:function(){var e,n;mr(null!==(e=null===(n=ln.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)},className:g(lt,ct[en],ut(P,gr),dt(en)[U],ge(ge(ge({},ft[en],(xr=Le,xr===Jn)),st(en),W),Lt[en],jn))},e.createElement("div",{onScroll:yr,ref:un,className:mt({size:P,overflow:fe})},ur,e.createElement("input",{"aria-label":null!=E?E:m,"aria-autocomplete":"list","aria-controls":an,"aria-labelledby":on,ref:sn,id:tn,className:g(gt,yt(P),bt[en],xt(pn),ge(ge({},wt(P,Sn),Rn(wn)),vt[en],W)),placeholder:Fn,"aria-disabled":W,readOnly:W,onChange:function(e){Nn(e.target.value),null==le||le(e.target.value),null==ke||ke(e)},value:Sn,autoComplete:"off"})),e.createElement("div",{className:g(pt,ht[P])},ue&&_r(wn)&&!W&&e.createElement(M,{"aria-label":"Clear selection",disabled:W,ref:cn,onClick:function(e){W||(e.stopPropagation(),Bn(null),null==se||se(e),null==le||le(""),Gn())},onFocus:function(){vn(null)},className:g(kt),darkMode:Qe},e.createElement(D,{glyph:"XWithCircle"})),e.createElement(D,{glyph:"CaretDown",className:Et,fill:g(ge(ge({},Nt(en),!W),Dt(en),W))}))),e.createElement(x,kr),e.createElement(j,wr,e.createElement(Wn,{id:an,labelId:on,refEl:ln,ref:dn,menuWidth:hr,searchLoadingMessage:ie,searchErrorMessage:te,searchEmptyMessage:ne,dropdownWidthBasis:qe},cr)))));function Er(e){un&&un.current&&(e===We.scrollX&&(un.current.scrollLeft=un.current.scrollWidth),e===We.expandY&&(un.current.scrollTop=un.current.scrollHeight))}}export{It as Combobox,xn as ComboboxGroup,yr as ComboboxOption,je as ComboboxSize,Te as DropdownWidthBasis,We as Overflow,Fe as SearchState,Ae as State};
|
|
1
|
+
import e,{createContext as n,useContext as r,useEffect as t,useMemo as o,useCallback as i,useRef as a,useState as l}from"react";import c from"lodash/clone";import u from"lodash/debounce";import s from"lodash/isArray";import d from"lodash/isEqual";import f from"lodash/isNull";import p from"lodash/isString";import h from"lodash/isUndefined";import{css as m,cx as g,keyframes as b}from"@leafygreen-ui/emotion";import{FormFieldState as v,DEFAULT_MESSAGES as y,FormFieldFeedback as x}from"@leafygreen-ui/form-field";import{useForwardedRef as w,useIdAllocator as k,useAvailableSpace as E,useDynamicRefs as C,usePrevious as S,useAutoScroll as L,useBackdropClick as N}from"@leafygreen-ui/hooks";import{Icon as D,isComponentGlyph as O}from"@leafygreen-ui/icon";import{IconButton as M}from"@leafygreen-ui/icon-button";import I,{useDarkMode as z,PopoverPropsProvider as j}from"@leafygreen-ui/leafygreen-provider";import{createUniqueClassName as W,keyMap as A,Theme as F,isComponentType as T,consoleOnce as X}from"@leafygreen-ui/lib";import{Popover as P,RenderMode as R,getPopoverRenderModeProps as G,DismissMode as B}from"@leafygreen-ui/popover";export{RenderMode}from"@leafygreen-ui/popover";import{Error as H,Label as V,Description as K}from"@leafygreen-ui/typography";import{transparentize as Y}from"polished";import{palette as U}from"@leafygreen-ui/palette";import{typeScales as Z,spacing as q,fontWeights as $,boxShadows as J,fontFamilies as Q,color as _,transitionDuration as ee,focusRing as ne}from"@leafygreen-ui/tokens";import{chipTextClassName as re,TruncationLocation as te,Chip as oe,BaseFontSize as ie,Variant as ae}from"@leafygreen-ui/chip";export{TruncationLocation}from"@leafygreen-ui/chip";import le from"lodash/kebabCase";import{descriptionClassName as ce,titleClassName as ue,leftGlyphClassName as se,InputOption as de,InputOptionContent as fe}from"@leafygreen-ui/input-option";import{Checkbox as pe}from"@leafygreen-ui/checkbox";import he from"lodash/escapeRegExp";function me(e,n){(null==n||n>e.length)&&(n=e.length);for(var r=0,t=Array(n);r<n;r++)t[r]=e[r];return t}function ge(e,n,r){return(n=function(e){var n=function(e,n){if("object"!=typeof e||!e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var t=r.call(e,n);if("object"!=typeof t)return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e,"string");return"symbol"==typeof n?n:n+""}(n))in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function be(){return be=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)({}).hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},be.apply(null,arguments)}function ve(e,n){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n&&(t=t.filter(function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable})),r.push.apply(r,t)}return r}function ye(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?ve(Object(r),!0).forEach(function(n){ge(e,n,r[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ve(Object(r)).forEach(function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))})}return e}function xe(e,n){if(null==e)return{};var r,t,o=function(e,n){if(null==e)return{};var r={};for(var t in e)if({}.hasOwnProperty.call(e,t)){if(-1!==n.indexOf(t))continue;r[t]=e[t]}return r}(e,n);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(t=0;t<i.length;t++)r=i[t],-1===n.indexOf(r)&&{}.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function we(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var t,o,i,a,l=[],c=!0,u=!1;try{if(i=(r=r.call(e)).next,0===n);else for(;!(c=(t=i.call(r)).done)&&(l.push(t.value),l.length!==n);c=!0);}catch(e){u=!0,o=e}finally{try{if(!c&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(u)throw o}}return l}}(e,n)||Se(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 ke(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function Ee(e){return function(e){if(Array.isArray(e))return me(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||Se(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 Ce(e){return Ce="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},Ce(e)}function Se(e,n){if(e){if("string"==typeof e)return me(e,n);var r={}.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?me(e,n):void 0}}var Le="Input",Ne="ClearButton",De="FirstChip",Oe="LastChip",Me="MiddleChip",Ie="Combobox",ze="Menu",je={XSmall:"xsmall",Small:"small",Default:"default",Large:"large"},We={expandY:"expand-y",scrollX:"scroll-x",expandX:"expand-x"},Ae=v,Fe={Unset:"unset",Error:"error",Loading:"loading"},Te={Trigger:"trigger",Option:"option"};var Xe,Pe,Re,Ge,Be,He,Ve,Ke,Ye,Ue=n({multiselect:!1,size:je.Default,withIcons:!1,disabled:!1,isOpen:!1,state:Ae.None,searchState:Fe.Unset,overflow:We.expandY}),Ze=W("combobox-chip"),qe=ge(ge(ge(ge({},je.XSmall,16),je.Small,Z.body1.lineHeight),je.Default,Z.body1.lineHeight),je.Large,Z.body2.lineHeight),$e=ge(ge(ge(ge({},je.XSmall,Z.body1.fontSize),je.Small,Z.body1.fontSize),je.Default,Z.body1.fontSize),je.Large,Z.body2.fontSize),Je=ge(ge(ge(ge({},je.XSmall,1),je.Small,0),je.Default,2),je.Large,4),Qe=ge(ge(ge(ge({},je.XSmall,m(Xe||(Xe=ke(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),$e[je.XSmall],qe[je.XSmall],re,Je[je.XSmall])),je.Small,m(Pe||(Pe=ke(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),$e[je.Small],qe[je.Small],re,Je[je.Small])),je.Default,m(Re||(Re=ke(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),$e[je.Default],qe[je.Default],re,Je[je.Default])),je.Large,m(Ge||(Ge=ke(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-inline-end: 10px;\n padding-block: ","px;\n }\n "])),$e[je.Large],qe[je.Large],re,Je[je.Large])),_e=e.forwardRef(function(n,o){var i,a=n.displayName,l=n.isFocused,c=n.onRemove,u=n.onFocus,s=r(Ue),d=s.size,f=s.disabled,p=s.overflow,h=s.chipTruncationLocation,m=void 0===h?te.End:h,b=s.chipCharacterLimit,v=void 0===b?12:b,y=p===We.scrollX?te.None:m,x=w(o,null),k=null===(i=x.current)||void 0===i?void 0:i.querySelector("button");t(function(){l&&!f&&(null==k||k.focus())},[f,k,l]);return e.createElement(oe,{label:a,className:g(Ze,Qe[d]),role:"option","aria-selected":l,"data-testid":"lg-combobox-chip",onClick:function(e){null!=k&&k.contains(e.target)||u()},onKeyDown:function(e){f||e.key!==A.Delete&&e.key!==A.Backspace&&e.key!==A.Enter&&e.key!==A.Space||c()},onDismiss:function(){f||c()},baseFontSize:ie.Body1,chipCharacterLimit:v,chipTruncationLocation:y,variant:ae.Gray,ref:x,disabled:f,tabIndex:-1})});_e.displayName="ComboboxChip";var en,nn,rn,tn,on,an,ln,cn,un,sn,dn,fn,pn,hn,mn,gn=ge(ge({},F.Light,m(Be||(Be=ke(["\n padding-top: ","px;\n "])),q[2])),F.Dark,m(He||(He=ke(["\n padding-top: ","px;\n "])),q[2])),bn=m(Ve||(Ve=ke(["\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: ",";\n text-transform: uppercase;\n letter-spacing: 0.4px;\n"])),$.semiBold),vn=ge(ge({},F.Light,m(Ke||(Ke=ke(["\n color: ",";\n "])),U.gray.dark1)),F.Dark,m(Ye||(Ye=ke(["\n color: ",";\n "])),U.gray.light1));function yn(n){var r=n.label,t=n.className,o=n.children,i=z().theme,a=k({prefix:"combobox-group"});return e.Children.count(o)>0?e.createElement("div",{className:g(gn[i],t)},e.createElement("div",{className:g(bn,vn[i]),id:a},r),e.createElement("div",{role:"group","aria-labelledby":a},o)):e.createElement(e.Fragment,null)}function xn(e){throw Error("`ComboboxGroup` must be a child of a `Combobox` instance")}xn.displayName="ComboboxGroup";var wn=ge(ge(ge(ge({},je.XSmall,{x:12,y:8}),je.Small,{x:12,y:8}),je.Default,{x:12,y:8}),je.Large,{x:12,y:8}),kn=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:384;return m(en||(en=ke(["\n width: ","px;\n overflow: hidden;\n border-radius: 12px;\n border: 1px solid;\n"])),e)},En=ge(ge({},F.Light,m(nn||(nn=ke(["\n box-shadow: ",";\n border-color: ",";\n "])),J[F.Light][1],U.gray.light2)),F.Dark,m(rn||(rn=ke(["\n box-shadow: ",";\n border-color: ",";\n "])),J[F.Dark][1],U.gray.dark2)),Cn=m(tn||(tn=ke(["\n width: max-content;\n"]))),Sn=m(on||(on=ke(["\n position: relative;\n width: 100%;\n margin: 0;\n padding: ","px 0;\n font-family: ",";\n border-radius: inherit;\n overflow-y: auto;\n scroll-behavior: smooth;\n"])),q[2],Q.default);ge(ge({},F.Light,m(an||(an=ke(["\n color: ",";\n background-color: ",";\n "])),U.black,U.white)),F.Dark,m(ln||(ln=ke(["\n color: ",";\n background-color: ",";\n "])),U.gray.light1,U.gray.dark3));var Ln,Nn=function(e){return m(cn||(cn=ke(["\n background-color: ",";\n"])),_[e].background.primary.default)},Dn=m(un||(un=ke(["\n position: relative;\n margin: 0;\n padding: 0;\n"]))),On=m(sn||(sn=ke(["\n font-family: inherit;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"]))),Mn=ge(ge({},F.Light,m(dn||(dn=ke(["\n color: ",";\n "])),U.gray.dark3)),F.Dark,m(fn||(fn=ke(["\n color: ",";\n "])),U.gray.light3)),In=function(e){return m(pn||(pn=ke(["\n font-size: ","px;\n line-height: ","px;\n padding: ","px ","px;\n"])),$e[e],qe[e],wn[e].y,wn[e].x)},zn=b(hn||(hn=ke(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"]))),jn=m(mn||(mn=ke(["\n animation: "," 1.5s linear infinite;\n"])),zn),Wn=e.forwardRef(function(n,t){var i=n.children,a=n.id,l=n.refEl,c=n.labelId,u=n.menuWidth,s=n.searchLoadingMessage,d=n.searchErrorMessage,f=n.searchEmptyMessage,p=n.dropdownWidthBasis,b=void 0===p?Te.Trigger:p,v=z(),y=v.darkMode,x=v.theme,k=r(Ue),C=k.disabled,S=k.size,L=k.isOpen,N=k.searchState,O=w(t,null),M=E(l),I=h(M)?"unset":"".concat(Math.min(M,256),"px"),j=o(function(){var n=g(On,Mn[x],In(S)),r=g(On,In(S));switch(N){case"loading":return e.createElement("span",{className:n},e.createElement(D,{glyph:"Refresh",color:y?U.blue.light1:U.blue.base,className:jn}),s);case"error":return e.createElement(H,{className:r},e.createElement(D,{glyph:"Warning",color:y?U.red.light1:U.red.base}),e.createElement("span",null,d));default:return i&&"object"===Ce(i)&&"length"in i&&i.length>0?e.createElement("ul",{className:Dn},i):e.createElement("span",{className:n},f)}},[x,S,N,y,s,d,i,f]);return e.createElement(P,{active:L&&!C,spacing:4,align:"bottom",justify:"middle",refEl:l,adjustOnMutation:!0,className:g(kn(u),En[x],ge({},Cn,b===Te.Option))},e.createElement("div",{ref:O,id:a,role:"listbox","aria-labelledby":c,"aria-expanded":L,className:g(Sn,Nn(x),m(Ln||(Ln=ke(["\n max-height: ",";\n "])),I)),onMouseDownCapture:function(e){return e.preventDefault()}},j))});Wn.displayName="ComboboxMenu";var An,Fn,Tn,Xn,Pn,Rn,Gn,Bn,Hn,Vn,Kn,Yn,Un,Zn,qn,$n,Jn,Qn,_n,er,nr=function(e){var n=e.scrollHeight;return e.scrollTop<n-e.clientHeight},rr=function(e){var n,r=e.value,t=e.displayName;return{value:null!=r?r:le(t),displayName:null!==(n=null!=t?t:r)&&void 0!==n?n:""}},tr=function(n){return e.Children.toArray(n).reduce(function(e,n){if(T(n,"ComboboxOption")){var r=rr(n.props),t=r.value,o=r.displayName,i=n.props,a=i.glyph,l=i.disabled;return[].concat(Ee(e),[{value:t,displayName:o,isDisabled:!!l,hasGlyph:!!a}])}if(T(n,"ComboboxGroup")){var c=n.props.children;if(c)return[].concat(Ee(e),Ee(tr(c)))}},[])},or=function(e,n){if(e)return n.find(function(n){return n.value===e})},ir=function(e,n){var r,t;return e?null!==(r=null===(t=or(e,n))||void 0===t?void 0:t.displayName)&&void 0!==r?r:e:""},ar=m(An||(An=ke(["\n .",", ."," {\n font-size: ","px;\n line-height: 20px;\n }\n"])),ce,ue,Z.body2.fontSize),lr=ge(ge(ge(ge({},je.XSmall,m(Fn||(Fn=ke(["\n min-width: ","px;\n "])),q[3])),je.Small,m(Tn||(Tn=ke(["\n min-width: ","px;\n "])),q[3])),je.Default,m(Xn||(Xn=ke(["\n min-width: ","px;\n "])),q[3])),je.Large,m(Pn||(Pn=ke(["\n min-width: ","px;\n "])),q[4])),cr=m(Rn||(Rn=ke(["\n pointer-events: none;\n gap: 0;\n\n label {\n gap: 0;\n align-items: center;\n }\n"])));m(Gn||(Gn=ke(["\n pointer-events: none;\n"])));var ur=function(e){return m(Bn||(Bn=ke(["\n font-weight: ",";\n"])),e?$.semiBold:$.regular)},sr=ge(ge({},F.Light,m(Hn||(Hn=ke(["\n color: ",";\n "])),U.gray.dark1)),F.Dark,m(Vn||(Vn=ke(["\n color: ",";\n "])),U.gray.base)),dr=ge(ge({},F.Light,m(Kn||(Kn=ke(["\n color: ",";\n "])),U.blue.dark1)),F.Dark,m(Yn||(Yn=ke(["\n color: ",";\n "])),U.blue.light3)),fr=ge(ge({},F.Light,m(Un||(Un=ke(["\n color: ",";\n "])),U.gray.light1)),F.Dark,m(Zn||(Zn=ke(["\n color: ",";\n "])),U.gray.dark1)),pr=ge(ge({},F.Light,m(qn||(qn=ke(["\n color: ",";\n "])),U.blue.base)),F.Dark,m($n||($n=ke(["\n color: ",";\n "])),U.blue.light1)),hr=ge(ge({},F.Light,m(Jn||(Jn=ke(["\n color: ",";\n "])),U.gray.light1)),F.Dark,m(Qn||(Qn=ke(["\n color: ",";\n "])),U.gray.dark1)),mr=m(_n||(_n=ke(["\n ."," {\n align-self: baseline;\n position: relative;\n // aligns the checkbox with the option name\n top: 1px;\n }\n"])),se),gr=m(er||(er=ke(["\n ."," {\n // aligns the checkbox with the option name\n top: 3px;\n }\n"])),se),br=["glyph","isSelected","displayName","isFocused","setSelected","className","description","value","onClick","disabled"],vr=e.forwardRef(function(n,t){var a=n.glyph,l=n.isSelected,c=n.displayName,u=n.isFocused,s=n.setSelected,d=n.className,f=n.description,p=n.value,h=n.onClick,m=n.disabled,b=void 0!==m&&m,v=xe(n,br),y=z(),x=y.darkMode,E=y.theme,C=r(Ue),S=C.multiselect,L=C.size,N=C.withIcons,M=C.inputValue,I=w(t,null),j=k({prefix:"combobox-option-text"}),W=i(function(e){e.stopPropagation(),b||(s(),null==h||h(e,p))},[b,h,s,p]),A=o(function(){return function(n){var r=n.withIcons,t=n.isSelected,o=n.glyph,i=n.optionTextId,a=n.disabled,l=n.darkMode,c=n.size,u=n.multiselect,s=n.theme,d=n.isFocused;o&&!O(o)&&console.error("`ComboboxOption` instance did not render icon because it is not a known glyph element.",o);var f=o&&O(o)?e.cloneElement(o,ye(ye({},o.props),{},{className:g(sr[s],ge(ge({},dr[s],d),fr[s],a),o.props.className)})):e.createElement(e.Fragment,null),p=e.createElement(pe,{"aria-labelledby":i,checked:t,tabIndex:-1,disabled:a,darkMode:l,className:cr}),h=e.createElement(D,{glyph:"Checkmark",className:g(lr[c],pr[s],ge({},hr[s],a))});return{leftGlyph:u?r?f:p:r?f:t?h:null,rightGlyph:u?r&&p:r&&t&&h}}({withIcons:N,isSelected:l,glyph:a,theme:E,darkMode:x,size:L,disabled:b,multiselect:S,optionTextId:j,isFocused:u})},[x,b,a,l,S,j,L,E,N,u]),F=A.leftGlyph,T=A.rightGlyph,X=S&&!N;return e.createElement(de,be({},v,{as:"li",ref:I,highlighted:u,disabled:b,"aria-label":c,darkMode:x,className:g(ge(ge(ge({},ar,L===je.Large),mr,X),gr,X&&L===je.Large),d),onClick:W,onKeyDown:W}),e.createElement(fe,{leftGlyph:F,rightGlyph:T,description:f},e.createElement("span",{id:j,className:ur(l)},function(n,r,t){if(r&&t){var o=he(r),i=new RegExp(o,"gi"),a=n.matchAll(i);if(a){for(var l=n.split(""),c=0,u=Array.from(a);c<u.length;c++){var s,d=u[c],f=null!==(s=d.index)&&void 0!==s?s:-1,p=d[0],h=p.length,m=f+p+h,g=new Array(h).fill("");g[0]=e.createElement(t,{key:m},p),l.splice.apply(l,[f,h].concat(Ee(g)))}return e.createElement(e.Fragment,null,l)}return e.createElement(e.Fragment,null,n)}return e.createElement(e.Fragment,null,n)}(c,M,"strong"))))});function yr(e){throw Error("`ComboboxOption` must be a child of a `Combobox` instance")}vr.displayName="ComboboxOption",yr.displayName="ComboboxOption";var xr,wr,kr,Er,Cr,Sr,Lr,Nr,Dr,Or,Mr,Ir,zr,jr,Wr,Ar,Fr,Tr,Xr,Pr,Rr,Gr,Br,Hr,Vr,Kr,Yr,Ur,Zr,qr,$r,Jr,Qr,_r=function(e){return!h(e)&&!f(e)&&(p(e)||s(e)&&e.length>0)},et=function(e){return qe[e]+2*Je[e]},nt=q[100],rt=ge(ge(ge(ge({},je.XSmall,22),je.Small,28),je.Default,36),je.Large,48),tt=function(e){return(rt[e]-et(e)-2)/2},ot=ge(ge(ge(ge({},je.XSmall,{y:tt(je.XSmall),xLeftWithChip:q[25],xLeftWithoutChip:q[200],xRight:q[100]}),je.Small,{y:tt(je.Small),xLeftWithChip:q[100],xLeftWithoutChip:q[200],xRight:q[100]}),je.Default,{y:tt(je.Default),xLeftWithChip:q[150],xLeftWithoutChip:q[300],xRight:q[200]}),je.Large,{y:tt(je.Large),xLeftWithChip:q[300],xLeftWithoutChip:q[300],xRight:q[200]}),it=q[400],at=function(e){return m(xr||(xr=ke(["\n font-family: ",";\n width: 100%;\n min-width: ","px;\n "])),Q.default,$e[e]+2*ot[e].xLeftWithChip+it+2)},lt=m(wr||(wr=ke(["\n display: flex;\n align-items: center;\n gap: ","px;\n cursor: text;\n transition: ","ms ease-in-out;\n transition-property: background-color, box-shadow, border-color;\n border: 1px solid;\n width: 100%;\n max-width: 100%;\n border-radius: 6px;\n position: relative;\n overflow: hidden;\n\n // Overflow shadow\n ::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 20px;\n bottom: -21px;\n left: 50%;\n translate: -50% 0%;\n border-radius: 20%;\n box-shadow: 0 0 0 0 rgb(255 255 255 / 0%);\n transition: ","ms linear;\n transition-property: box-shadow;\n }\n"])),q[200],ee.default,ee.default),ct=ge(ge({},F.Light,m(kr||(kr=ke(["\n color: ",";\n background-color: ",";\n "])),_.light.text.primary.default,_.light.background.primary.default)),F.Dark,m(Er||(Er=ke(["\n color: ",";\n background-color: ",";\n "])),_.dark.text.primary.default,U.gray.dark4)),ut=function(e,n){return m(Cr||(Cr=ke(["\n padding-top: ","px;\n padding-bottom: ","px;\n padding-left: ",";\n padding-right: ","px;\n"])),ot[e].y,ot[e].y,"".concat(n?ot[e].xLeftWithChip:ot[e].xLeftWithoutChip,"px"),ot[e].xRight)},st=function(e){return m(Sr||(Sr=ke(["\n cursor: not-allowed;\n color: ",";\n background-color: ",";\n border-color: ",";\n"])),_[e].text.disabled.default,_[e].background.disabled.default,_[e].border.disabled.default)},dt=function(e){return ge(ge(ge({},Ae.Error,m(Lr||(Lr=ke(["\n border-color: ",";\n "])),_[e].border.error.default)),Ae.None,m(Nr||(Nr=ke(["\n border-color: ",";\n "])),_[e].border.primary.default)),Ae.Valid,m(Dr||(Dr=ke(["\n border-color: ",";\n "])),_[e].border.success.default))},ft=ge(ge({},F.Light,m(Or||(Or=ke(["\n &:focus-within {\n border-color: transparent;\n box-shadow: ",";\n }\n "])),ne[F.Light].input)),F.Dark,m(Mr||(Mr=ke(["\n &:focus-within {\n border-color: transparent;\n box-shadow: ",";\n }\n "])),ne[F.Dark].input)),pt=m(Ir||(Ir=ke(["\n display: flex;\n align-items: center;\n"]))),ht=ge(ge(ge(ge({},je.XSmall,m(zr||(zr=ke(["\n gap: ","px;\n "])),q[100])),je.Small,m(jr||(jr=ke(["\n gap: ","px;\n "])),q[200])),je.Default,m(Wr||(Wr=ke(["\n gap: ","px;\n "])),q[200])),je.Large,m(Ar||(Ar=ke(["\n gap: ","px;\n "])),q[200])),mt=function(e){var n=e.overflow,r=e.size,t=m(Fr||(Fr=ke(["\n flex-grow: 1;\n width: 100%;\n "])));switch(n){case We.scrollX:return m(Tr||(Tr=ke(["\n ","\n display: block;\n height: ","px;\n white-space: nowrap;\n overflow-x: scroll;\n scroll-behavior: smooth;\n scrollbar-width: none;\n line-height: 1;\n\n &::-webkit-scrollbar {\n display: none;\n }\n\n & > ."," {\n margin-inline: 2px;\n\n &:first-child {\n margin-inline-start: 0;\n }\n\n &:last-child {\n margin-inline-end: 0;\n }\n }\n "])),t,et(r),Ze);case We.expandY:return m(Xr||(Xr=ke(["\n ","\n display: flex;\n flex-wrap: wrap;\n gap: ","px;\n overflow-x: hidden;\n min-height: ","px;\n max-height: calc((","px) + (","px * 2));\n "])),t,nt,et(r),3*et(r),nt)}},gt=m(Pr||(Pr=ke(["\n font-family: ",";\n width: 100%;\n border: none;\n cursor: inherit;\n background-color: inherit;\n color: inherit;\n box-sizing: content-box;\n padding: 0;\n margin: 0;\n text-overflow: ellipsis;\n vertical-align: top;\n\n // Only add padding if there are chips\n &:not(:first-child) {\n padding-left: ","px;\n }\n\n &:placeholder-shown {\n min-width: 100%;\n }\n &:focus {\n outline: none;\n }\n"])),Q.default,q[100]),bt=ge(ge({},F.Light,m(Rr||(Rr=ke(["\n &::placeholder {\n color: ",";\n }\n "])),U.gray.base)),F.Dark,m(Gr||(Gr=ke(["\n &::placeholder {\n color: ",";\n }\n "])),U.gray.dark1)),vt=ge(ge({},F.Light,m(Br||(Br=ke(["\n &::placeholder {\n color: ",";\n }\n "])),U.gray.base)),F.Dark,m(Hr||(Hr=ke(["\n &::placeholder {\n color: ",";\n }\n "])),U.gray.dark1)),yt=function(e){return m(Vr||(Vr=ke(["\n height: ","px;\n font-size: ","px;\n line-height: ","px;\n min-width: ","px;\n"])),et(e),$e[e],qe[e],$e[e])},xt=function(e){return m(Kr||(Kr=ke(["\n /*\n * Immediate transition in, slow transition out. \n * '-in' transition is handled by `scroll-behavior` \n */\n transition: width ease-in-out ",";\n"],["\n /*\n * Immediate transition in, slow transition out. \n * '-in' transition is handled by \\`scroll-behavior\\` \n */\n transition: width ease-in-out ",";\n"])),e?"0s":"100ms")},wt=function(e,n){var r,t=null!==(r=null==n?void 0:n.length)&&void 0!==r?r:0;return m(Yr||(Yr=ke(["\n width: ","px;\n max-width: 100%;\n "])),t*$e[e])},kt=m(Ur||(Ur=ke(["\n // Add a negative margin so the button takes up the same space as the regular icons\n margin-block: calc(","px - 100%);\n margin-inline: -6px;\n"])),it/2),Et=m(Zr||(Zr=ke(["\n height: ","px;\n width: ","px;\n"])),it,it),Ct=m(qr||(qr=ke(["\n margin-bottom: ","px;\n display: flex;\n flex-direction: column;\n"])),q[100]),St=m($r||($r=ke(["\n font-size: ","px;\n line-height: ","px;\n"])),Z.large.fontSize,Z.large.lineHeight),Lt=ge(ge({},F.Light,m(Jr||(Jr=ke(["\n ::after {\n box-shadow: 0px 0px 7px 5px ",";\n }\n "])),Y(.85,U.black))),F.Dark,m(Qr||(Qr=ke(["\n ::after {\n width: 95%;\n box-shadow: 0px -7px 12px 5px rgb(0 0 0 / 50%);\n }\n "])))),Nt=function(e){return _[e].icon.primary.default},Dt=function(e){return _[e].icon.disabled.default},Ot=["children","label","description","placeholder","aria-label","disabled","size","darkMode","state","errorMessage","successMessage","searchState","searchEmptyMessage","searchErrorMessage","searchLoadingMessage","filteredOptions","onFilter","clearable","onClear","overflow","multiselect","initialValue","inputValue","onInputChange","onChange","value","chipTruncationLocation","chipCharacterLimit","className","renderMode","portalClassName","portalContainer","portalRef","scrollContainer","popoverZIndex","dropdownWidthBasis"],Mt=["className","glyph","disabled"];function It(n){var r=n.children,m=n.label,b=n.description,v=n.placeholder,w=void 0===v?"Select":v,E=n["aria-label"],O=n.disabled,W=void 0!==O&&O,F=n.size,P=void 0===F?je.Default:F,H=n.darkMode,Y=n.state,U=void 0===Y?"none":Y,Z=n.errorMessage,q=void 0===Z?y.error:Z,$=n.successMessage,J=void 0===$?y.success:$,Q=n.searchState,_=void 0===Q?"unset":Q,ee=n.searchEmptyMessage,ne=void 0===ee?"No results found":ee,re=n.searchErrorMessage,te=void 0===re?"Could not get results!":re,oe=n.searchLoadingMessage,ie=void 0===oe?"Loading results...":oe,ae=n.filteredOptions,le=n.onFilter,ce=n.clearable,ue=void 0===ce||ce,se=n.onClear,de=n.overflow,fe=void 0===de?We.expandY:de,pe=n.multiselect,he=void 0!==pe&&pe,me=n.initialValue,ve=n.inputValue,ke=n.onInputChange,Ee=n.onChange,Se=n.value,Ae=n.chipTruncationLocation,Fe=n.chipCharacterLimit,Xe=void 0===Fe?12:Fe,Pe=n.className,Re=n.renderMode,Ge=void 0===Re?R.TopLayer:Re,Be=n.portalClassName,He=n.portalContainer,Ve=n.portalRef,Ke=n.scrollContainer,Ye=n.popoverZIndex,Ze=n.dropdownWidthBasis,qe=void 0===Ze?Te.Trigger:Ze,$e=xe(n,Ot),Je=z(H),Qe=Je.darkMode,en=Je.theme,nn=C({prefix:"option"}),rn=C({prefix:"chip"}),tn=k({prefix:"combobox-input"}),on=k({prefix:"combobox-label"}),an=k({prefix:"combobox-menu"}),ln=a(null),cn=a(null),un=a(null),sn=a(null),dn=a(null),fn=we(l(!1),2),pn=fn[0],hn=fn[1],mn=S(pn),gn=we(l(null),2),bn=gn[0],vn=gn[1],xn=we(l(null),2),wn=xn[0],kn=xn[1],En=S(wn),Cn=we(l(null!=ve?ve:""),2),Sn=Cn[0],Ln=Cn[1];t(function(){h(ve)||Ln(ve)},[ve]);var Nn=function(e){Ln(e)},Dn=S(Sn),On=we(l(null),2),Mn=On[0],In=On[1],zn=we(l(!1),2),jn=zn[0],An=zn[1],Fn=he&&s(wn)&&wn.length>0?void 0:w,Tn=function(){return hn(!1)},Xn=function(){return hn(!0)},Pn=o(function(){return tr(r)},[r]),Rn=i(function(e){return!he||"string"!=typeof e&&"number"!=typeof e?!he&&s(e)&&X.error("Error in Combobox: multiselect is set to `false`, but received an Array value"):X.error("Error in Combobox: multiselect is set to `true`, but received a ".concat(Ce(e),' value: "').concat(e,'"')),he&&s(e)},[he]),Gn=i(function(e){!W&&sn&&sn.current&&(sn.current.focus(),h(e)||sn.current.setSelectionRange(e,e))},[W]),Bn=i(function(e){if(Rn(wn)){var n=c(wn),r=Ee,t={diffType:"delete",value:null!=e?e:wn};f(e)?n.length=0:wn.includes(e)?n.splice(n.indexOf(e),1):(n.push(e),t.diffType="insert",Nn("")),kn(n),null==r||r(n,t)}else{var o=e,i=Ee;kn(o),null==i||i(o)}},[Rn,Ee,wn]),Hn=i(function(e){var n,r,t,o;return function(e,n){return Array.isArray(n)?n.includes(e):e===n}((r=Pn,(n=e)?null!==(t=null===(o=r.find(function(e){return e.displayName===n}))||void 0===o?void 0:o.value)&&void 0!==t?t:n:""),wn)},[Pn,wn]),Vn=i(function(e){var n="string"==typeof e?e:e.value;return ae&&ae.length>0?ae.includes(n):!!Hn(Sn)||("string"==typeof e?ir(n,Pn):e.displayName).toLowerCase().includes(Sn.toLowerCase())},[ae,Hn,Sn,Pn]),Kn=o(function(){return Pn.filter(Vn)},[Pn,Vn]),Yn=i(function(e){return!!e&&!!Pn.find(function(n){return n.value===e})},[Pn]),Un=i(function(e){return Kn?Kn.findIndex(function(n){return n.value===e}):-1},[Kn]),Zn=i(function(e){if(Kn&&Kn.length>=e){var n=Kn[e];return n?n.value:void 0}},[Kn]),qn=i(function(){return Rn(wn)?wn.findIndex(function(e){var n;return null===(n=rn(e))||void 0===n||null===(n=n.current)||void 0===n?void 0:n.contains(document.activeElement)}):-1},[rn,Rn,wn]),$n=we(l(),2),Jn=$n[0],Qn=$n[1],_n=i(function(e){var n,r=null!==(n=null==Kn?void 0:Kn.length)&&void 0!==n?n:0,t=r-1>0?r-1:0,o=Un(bn);switch(e&&pn&&(In(null),Gn()),e){case"next":var i=Zn(o+1<r?o+1:0);vn(null!=i?i:null);break;case"prev":var a=Zn(o-1>=0?o-1:t);vn(null!=a?a:null);break;case"last":var l=Zn(t);vn(null!=l?l:null);break;default:var c=Zn(0);vn(null!=c?c:null)}},[bn,Un,Zn,pn,Gn,null==Kn?void 0:Kn.length]),er=i(function(e,n){if(Rn(wn))switch(e){case"next":var r=null!=n?n:qn(),t=r+1<wn.length?r+1:wn.length-1,o=wn[t];In(o);break;case"prev":var i=null!=n?n:qn(),a=i>0?i-1:i<0?wn.length-1:0,l=wn[a];In(l);break;case"first":var c=wn[0];In(c);break;case"last":var u=wn[wn.length-1];In(u);break;default:In(null)}},[qn,Rn,wn]),ar=i(function(e,n){switch(e&&vn(null),e){case"right":switch(Jn){case Le:var r,t,o;if((null===(r=sn.current)||void 0===r?void 0:r.selectionEnd)===(null===(t=sn.current)||void 0===t?void 0:t.value.length))null===(o=cn.current)||void 0===o||o.focus();break;case De:case Me:case Oe:if(Jn===Oe||1===(null==wn?void 0:wn.length)){Gn(0),er(null),n.preventDefault();break}er("next")}break;case"left":switch(Jn){case Ne:var i;n.preventDefault(),Gn(null==sn||null===(i=sn.current)||void 0===i?void 0:i.value.length);break;case Le:case Me:case Oe:if(Rn(wn)){var a;if(Jn===Le&&0!==(null===(a=sn.current)||void 0===a?void 0:a.selectionStart))break;er("prev")}}break;default:er(null)}},[Jn,Rn,wn,Gn,er]);t(function(){pn||_n("first")},[pn,_n]),L(bn?nn(bn):void 0,dn);var lr=i(function(n){if(T(n,"ComboboxOption")){var r=rr(n.props),t=r.value,o=r.displayName;if(Vn(t)){var i=n.props,a=i.className,l=i.glyph,c=i.disabled,u=xe(i,Mt),s=Pn.findIndex(function(e){return e.value===t}),d=bn===t,f=Rn(wn)?wn.includes(t):wn===t,p=nn(t);return e.createElement(vr,be({},u,{value:t,displayName:o,isFocused:d,isSelected:f,disabled:c,setSelected:function(){vn(t),Bn(t),Gn(),t===wn&&Tn()},glyph:l,className:a,index:s,ref:p}))}}else if(T(n,"ComboboxGroup")){var h=e.Children.map(n.props.children,lr);if(h&&(null==h?void 0:h.length)>0)return e.createElement(yn,{label:n.props.label,className:n.props.className},e.Children.map(h,lr))}},[Pn,nn,bn,Rn,wn,Gn,Vn,Bn]),cr=o(function(){return e.Children.map(r,lr)},[r,lr]),ur=o(function(){if(Rn(wn))return wn.filter(Yn).map(function(n,r){var t=ir(n,Pn),o=Mn===n,i=rn(n),a=r>=wn.length-1;return e.createElement(_e,{key:n,displayName:t,isFocused:o,onRemove:function(){a?(Gn(),er(null)):er("next",r),Bn(n)},onFocus:function(){In(n)},ref:i})})},[Rn,wn,Yn,Pn,Mn,rn,Bn,Gn,er]),sr=o(function(){return Pn.some(function(e){return e.hasGlyph})},[Pn]),dr=i(function(){var e=Kn.find(function(e){return e.displayName===Sn||e.value===Sn});if(!Se&&e)Bn(e.value);else if(!Rn(wn)){var n,r=null!==(n=ir(wn,Pn))&&void 0!==n?n:En;Nn(r)}},[Pn,Sn,Rn,En,wn,Bn,Se,Kn]),fr=i(function(){if(_r(wn)){if(Rn(wn))Er(fe);else if(!Rn(wn)){var e,n=null!==(e=ir(wn,Pn))&&void 0!==e?e:"";Nn(n),Tn()}}else Nn("")},[Pn,Rn,wn,fe]);t(function(){if(me)if(s(me)){var e,n=null!==(e=me.filter(function(e){return Yn(e)}))&&void 0!==e?e:[];kn(n)}else Yn(me)&&kn(me);else kn(function(e){return e?[]:null}(he))},[]),t(function(){if(!h(Se)&&Se!==Dn)if(f(Se))kn(null);else if(Rn(Se)){var e=Se.filter(Yn);kn(e)}else kn(Yn(Se)?Se:null)},[Rn,Yn,Dn,Se]),t(function(){!h(En)&&(s(wn)&&!f(En)||p(wn)||f(wn))&&!d(wn,En)&&fr()},[fr,En,wn]),t(function(){!pn&&mn&&dr()},[pn,mn,dr]);var pr=we(l(0),2),hr=pr[0],mr=pr[1];t(function(){var e,n;mr(null!==(e=null===(n=ln.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)},[ln,pn,bn,wn]);N(Tn,[dn,ln],{enabled:pn});var gr=Rn(wn)&&!!wn.length,br=u(function(e){An(nr(e.target))},50,{leading:!0}),yr=i(function(e){fe===We.expandY&&br(e)},[br,fe]);t(function(){un.current&&An(nr(un.current))},[]);var xr,wr=ye({popoverZIndex:Ye},G({dismissMode:B.Manual,portalClassName:Be,portalContainer:He,portalRef:Ve,renderMode:Ge,scrollContainer:Ke})),kr={disabled:W,errorMessage:q,size:P,state:U,successMessage:J};return e.createElement(I,{darkMode:Qe},e.createElement(Ue.Provider,{value:{multiselect:he,size:P,withIcons:sr,disabled:W,isOpen:pn,state:U,searchState:_,chipTruncationLocation:Ae,chipCharacterLimit:Xe,inputValue:Sn,overflow:fe,popoverZIndex:Ye}},e.createElement("div",be({className:g(at(P),Pe)},$e),(m||b)&&e.createElement("div",{className:Ct},m&&e.createElement(V,{id:on,htmlFor:tn,darkMode:Qe,disabled:W,className:g(ge({},St,P===je.Large))},m),b&&e.createElement(K,{darkMode:Qe,disabled:W,className:g(ge({},St,P===je.Large))},b)),e.createElement("div",{ref:ln,role:"combobox","aria-expanded":pn,"aria-controls":an,"aria-owns":an,tabIndex:-1,onMouseDown:function(e){W&&e.preventDefault()},onClick:function(e){if(e.target!==sn.current){var n=0;if(sn.current)n=e.nativeEvent.offsetX>sn.current.offsetLeft+sn.current.clientWidth?Sn.length:0;Gn(n)}Xn()},onFocus:function(e){Er(fe),Qn(function(e){var n,r,t,o;if(!e)return;if(null!==(n=sn.current)&&void 0!==n&&n.contains(e))return Le;if(null!==(r=cn.current)&&void 0!==r&&r.contains(e))return Ne;var i=Rn(wn)?wn.findIndex(function(n){var r;return null===(r=rn(n))||void 0===r||null===(r=r.current)||void 0===r?void 0:r.contains(e)}):-1;if(Rn(wn)){if(0===i)return De;if(i===wn.length-1)return Oe;if(i>0)return Me}if(null!==(t=dn.current)&&void 0!==t&&t.contains(e))return ze;if(null!==(o=ln.current)&&void 0!==o&&o.contains(e))return Ie}(e.target))},onKeyDown:function(e){var n,r,t=null===(n=dn.current)||void 0===n?void 0:n.contains(document.activeElement);if((null===(r=ln.current)||void 0===r?void 0:r.contains(document.activeElement))||t){if(e.ctrlKey||e.shiftKey||e.altKey)return;switch(e.key){case A.Tab:switch(Jn){case"Input":_r(wn)||(Tn(),_n("first"),er(null));break;case"LastChip":er(null)}break;case A.Escape:Tn(),_n("first");break;case A.Enter:pn?!pn||Jn!==Le||f(bn)||function(e){if("string"==typeof e){var n=or(e,Pn);return!(null==n||!n.isDisabled)}return!!e.isDisabled}(bn)?Jn===Ne&&(Bn(null),Gn()):Bn(bn):Xn();break;case A.Backspace:var o;if(Rn(wn))"Input"===Jn&&0===(null===(o=sn.current)||void 0===o?void 0:o.selectionStart)&&er("last");Xn();break;case A.ArrowDown:pn?(e.preventDefault(),_n("next")):Xn();break;case A.ArrowUp:pn?(e.preventDefault(),_n("prev")):Xn();break;case A.ArrowRight:ar("right",e);break;case A.ArrowLeft:ar("left",e);break;default:pn||Xn()}}},onTransitionEnd:function(){var e,n;mr(null!==(e=null===(n=ln.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)},className:g(lt,ct[en],ut(P,gr),dt(en)[U],ge(ge(ge({},ft[en],(xr=Le,xr===Jn)),st(en),W),Lt[en],jn))},e.createElement("div",{onScroll:yr,ref:un,className:mt({size:P,overflow:fe})},ur,e.createElement("input",{"aria-label":null!=E?E:m,"aria-autocomplete":"list","aria-controls":an,"aria-labelledby":on,ref:sn,id:tn,className:g(gt,yt(P),bt[en],xt(pn),ge(ge({},wt(P,Sn),Rn(wn)),vt[en],W)),placeholder:Fn,"aria-disabled":W,readOnly:W,onChange:function(e){Nn(e.target.value),null==le||le(e.target.value),null==ke||ke(e)},value:Sn,autoComplete:"off"})),e.createElement("div",{className:g(pt,ht[P])},ue&&_r(wn)&&!W&&e.createElement(M,{"aria-label":"Clear selection",disabled:W,ref:cn,onClick:function(e){W||(e.stopPropagation(),Bn(null),null==se||se(e),null==le||le(""),Gn())},onFocus:function(){vn(null)},className:g(kt),darkMode:Qe},e.createElement(D,{glyph:"XWithCircle"})),e.createElement(D,{glyph:"CaretDown",className:Et,fill:g(ge(ge({},Nt(en),!W),Dt(en),W))}))),e.createElement(x,kr),e.createElement(j,wr,e.createElement(Wn,{id:an,labelId:on,refEl:ln,ref:dn,menuWidth:hr,searchLoadingMessage:ie,searchErrorMessage:te,searchEmptyMessage:ne,dropdownWidthBasis:qe},cr)))));function Er(e){un&&un.current&&(e===We.scrollX&&(un.current.scrollLeft=un.current.scrollWidth),e===We.expandY&&(un.current.scrollTop=un.current.scrollHeight))}}export{It as Combobox,xn as ComboboxGroup,yr as ComboboxOption,je as ComboboxSize,Te as DropdownWidthBasis,We as Overflow,Fe as SearchState,Ae as State};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|