@leafygreen-ui/combobox 11.0.2 → 11.0.3
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 +6 -0
- package/dist/Combobox/Combobox.d.ts.map +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
- package/src/Combobox/Combobox.spec.tsx +31 -0
- package/src/Combobox/Combobox.tsx +3 -4
- package/stories.js +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAYN,MAAM,OAAO,CAAC;AAmFf,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,OAAO,EAAE,EAC1C,QAAQ,EACR,KAAK,EACL,WAAW,EACX,WAAsB,EACtB,YAAY,EAAE,SAAS,EACvB,QAAgB,EAChB,IAA2B,EAC3B,QAAQ,EAAE,YAAY,EACtB,KAAc,EACd,YAAqC,EACrC,cAAyC,EACzC,WAAqB,EACrB,kBAAuC,EACvC,kBAA6C,EAC7C,oBAA2C,EAC3C,eAAe,EACf,QAAQ,EACR,SAAgB,EAChB,OAAO,EACP,QAA2B,EAC3B,WAAwB,EACxB,YAAY,EACZ,UAAU,EAAE,cAAc,EAC1B,aAAa,EACb,QAAQ,EACR,KAAK,EACL,sBAAsB,EACtB,kBAAuB,EACvB,SAAS,EACT,UAAgC,EAChC,eAAe,EACf,eAAe,EACf,SAAS,EACT,eAAe,EACf,aAAa,EACb,GAAG,IAAI,EACR,EAAE,aAAa,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAYN,MAAM,OAAO,CAAC;AAmFf,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,OAAO,EAAE,EAC1C,QAAQ,EACR,KAAK,EACL,WAAW,EACX,WAAsB,EACtB,YAAY,EAAE,SAAS,EACvB,QAAgB,EAChB,IAA2B,EAC3B,QAAQ,EAAE,YAAY,EACtB,KAAc,EACd,YAAqC,EACrC,cAAyC,EACzC,WAAqB,EACrB,kBAAuC,EACvC,kBAA6C,EAC7C,oBAA2C,EAC3C,eAAe,EACf,QAAQ,EACR,SAAgB,EAChB,OAAO,EACP,QAA2B,EAC3B,WAAwB,EACxB,YAAY,EACZ,UAAU,EAAE,cAAc,EAC1B,aAAa,EACb,QAAQ,EACR,KAAK,EACL,sBAAsB,EACtB,kBAAuB,EACvB,SAAS,EACT,UAAgC,EAChC,eAAe,EACf,eAAe,EACf,SAAS,EACT,eAAe,EACf,aAAa,EACb,GAAG,IAAI,EACR,EAAE,aAAa,CAAC,CAAC,CAAC,qBAiuClB;AAED;;;GAGG"}
|
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 s from"lodash/debounce";import u from"lodash/isArray";import d from"lodash/isEqual";import p from"lodash/isNull";import f from"lodash/isString";import h from"lodash/isUndefined";import{css as m,cx as b,keyframes as g}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 N,useAutoScroll as O,useBackdropClick as L}from"@leafygreen-ui/hooks";import S,{isComponentGlyph as M}from"@leafygreen-ui/icon";import D from"@leafygreen-ui/icon-button";import I,{useDarkMode as j,PopoverPropsProvider as z}from"@leafygreen-ui/leafygreen-provider";import{createUniqueClassName as A,keyMap as F,Theme as W,isComponentType as P,consoleOnce as R}from"@leafygreen-ui/lib";import T,{RenderMode as G,getPopoverRenderModeProps as H,DismissMode as V}from"@leafygreen-ui/popover";import{Error as K,Label as B,Description as Z}from"@leafygreen-ui/typography";import{chipTextClassName as U,TruncationLocation as q,Chip as X,BaseFontSize as $,Variant as J}from"@leafygreen-ui/chip";import{typeScales as Q,spacing as Y,fontWeights as _,fontFamilies as ee,color as ne,transitionDuration as re,focusRing as te}from"@leafygreen-ui/tokens";import{palette as oe}from"@leafygreen-ui/palette";import{transparentize as ie}from"polished";import{descriptionClassName as ae,titleClassName as le,leftGlyphClassName as ce,InputOption as se,InputOptionContent as ue}from"@leafygreen-ui/input-option";import de from"lodash/kebabCase";import pe from"lodash/escapeRegExp";import fe from"@leafygreen-ui/checkbox";function he(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 me(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?he(Object(r),!0).forEach((function(n){ve(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):he(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))}))}return e}function be(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+""}function ge(e){return ge="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},ge(e)}function ve(e,n,r){return(n=be(n))in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function ye(){return ye=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},ye.apply(this,arguments)}function xe(e,n){if(null==e)return{};var r,t,o=function(e,n){if(null==e)return{};var r,t,o={},i=Object.keys(e);for(t=0;t<i.length;t++)r=i[t],n.indexOf(r)>=0||(o[r]=e[r]);return o}(e,n);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(t=0;t<i.length;t++)r=i[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function we(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function ke(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,s=!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){s=!0,o=e}finally{try{if(!c&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(s)throw o}}return l}}(e,n)||Ce(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 Ee(e){return function(e){if(Array.isArray(e))return Ne(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||Ce(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,n){if(e){if("string"==typeof e)return Ne(e,n);var r=Object.prototype.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)?Ne(e,n):void 0}}function Ne(e,n){(null==n||n>e.length)&&(n=e.length);for(var r=0,t=new Array(n);r<n;r++)t[r]=e[r];return t}var Oe="Input",Le="ClearButton",Se="FirstChip",Me="LastChip",De="MiddleChip",Ie="Combobox",je="Menu",ze="xsmall",Ae="small",Fe="default",We="large",Pe="expand-y",Re="scroll-x",Te=v;var Ge,He,Ve,Ke,Be,Ze,Ue,qe,Xe,$e=n({multiselect:!1,size:Fe,withIcons:!1,disabled:!1,isOpen:!1,state:Te.None,searchState:"unset",overflow:Pe}),Je=A("combobox-chip"),Qe=ve(ve(ve(ve({},ze,16),Ae,Q.body1.lineHeight),Fe,Q.body1.lineHeight),We,Q.body2.lineHeight),Ye=ve(ve(ve(ve({},ze,Q.body1.fontSize),Ae,Q.body1.fontSize),Fe,Q.body1.fontSize),We,Q.body2.fontSize),_e=ve(ve(ve(ve({},ze,1),Ae,0),Fe,2),We,4),en=ve(ve(ve(ve({},ze,m(Ge||(Ge=we(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),Ye[ze],Qe[ze],U,_e[ze])),Ae,m(He||(He=we(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),Ye[Ae],Qe[Ae],U,_e[Ae])),Fe,m(Ve||(Ve=we(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),Ye[Fe],Qe[Fe],U,_e[Fe])),We,m(Ke||(Ke=we(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-inline-end: 10px;\n padding-block: ","px;\n }\n "])),Ye[We],Qe[We],U,_e[We])),nn=e.forwardRef((function(n,o){var i,a=n.displayName,l=n.isFocused,c=n.onRemove,s=n.onFocus,u=r($e),d=u.size,p=u.disabled,f=u.overflow,h=u.chipTruncationLocation,m=void 0===h?q.End:h,g=u.chipCharacterLimit,v=void 0===g?12:g,y=f===Re?q.None:m,x=w(o,null),k=null===(i=x.current)||void 0===i?void 0:i.querySelector("button");t((function(){l&&!p&&(null==k||k.focus())}),[p,k,l]);return e.createElement(X,{label:a,className:b(Je,en[d]),role:"option","aria-selected":l,"data-testid":"lg-combobox-chip",onClick:function(e){null!=k&&k.contains(e.target)||s()},onKeyDown:function(e){p||e.key!==F.Delete&&e.key!==F.Backspace&&e.key!==F.Enter&&e.key!==F.Space||c()},onDismiss:function(){p||c()},baseFontSize:$.Body1,chipCharacterLimit:v,chipTruncationLocation:y,variant:J.Gray,ref:x,disabled:p,tabIndex:-1})}));nn.displayName="ComboboxChip";var rn,tn,on,an,ln,cn,sn,un,dn,pn,fn,hn,mn,bn,gn=ve(ve({},W.Light,m(Be||(Be=we(["\n padding-top: ","px;\n "])),Y[2])),W.Dark,m(Ze||(Ze=we(["\n padding-top: ","px;\n "])),Y[2])),vn=m(Ue||(Ue=we(["\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"])),_.bold),yn=ve(ve({},W.Light,m(qe||(qe=we(["\n color: ",";\n "])),oe.gray.dark1)),W.Dark,m(Xe||(Xe=we(["\n color: ",";\n "])),oe.gray.light1));function xn(n){var r=n.label,t=n.className,o=n.children,i=j().theme,a=k({prefix:"combobox-group"});return e.Children.count(o)>0?e.createElement("div",{className:b(gn[i],t)},e.createElement("div",{className:b(vn,yn[i]),id:a},r),e.createElement("div",{role:"group","aria-labelledby":a},o)):e.createElement(e.Fragment,null)}function wn(e){throw Error("`ComboboxGroup` must be a child of a `Combobox` instance")}wn.displayName="ComboboxGroup";var kn=ve(ve(ve(ve({},ze,{x:12,y:8}),Ae,{x:12,y:8}),Fe,{x:12,y:8}),We,{x:12,y:8}),En=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:384;return m(rn||(rn=we(["\n width: ","px;\n overflow: hidden;\n border-radius: 12px;\n border: 1px solid;\n"])),e)},Cn=ve(ve({},W.Light,m(tn||(tn=we(["\n box-shadow: 0px 4px 7px ",";\n border-color: ",";\n "])),ie(.85,oe.black),oe.gray.light2)),W.Dark,m(on||(on=we(["\n box-shadow: 0px 4px 7px ",";\n border-color: ",";\n "])),ie(.85,oe.black),oe.gray.dark2)),Nn=m(an||(an=we(["\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"])),Y[2],ee.default);ve(ve({},W.Light,m(ln||(ln=we(["\n color: ",";\n background-color: ",";\n "])),oe.black,oe.white)),W.Dark,m(cn||(cn=we(["\n color: ",";\n background-color: ",";\n "])),oe.gray.light1,oe.gray.dark3));var On,Ln=function(e){return m(sn||(sn=we(["\n background-color: ",";\n"])),ne[e].background.primary.default)},Sn=m(un||(un=we(["\n position: relative;\n margin: 0;\n padding: 0;\n"]))),Mn=m(dn||(dn=we(["\n font-family: inherit;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"]))),Dn=ve(ve({},W.Light,m(pn||(pn=we(["\n color: ",";\n "])),oe.gray.dark3)),W.Dark,m(fn||(fn=we(["\n color: ",";\n "])),oe.gray.light3)),In=function(e){return m(hn||(hn=we(["\n font-size: ","px;\n line-height: ","px;\n padding: ","px ","px;\n"])),Ye[e],Qe[e],kn[e].y,kn[e].x)},jn=g(mn||(mn=we(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"]))),zn=m(bn||(bn=we(["\n animation: "," 1.5s linear infinite;\n"])),jn),An=e.forwardRef((function(n,t){var i=n.children,a=n.id,l=n.refEl,c=n.labelId,s=n.menuWidth,u=n.searchLoadingMessage,d=n.searchErrorMessage,p=n.searchEmptyMessage,f=j(),g=f.darkMode,v=f.theme,y=r($e),x=y.disabled,k=y.size,C=y.isOpen,N=y.searchState,O=w(t,null),L=E(l),M=h(L)?"unset":"".concat(Math.min(L,256),"px"),D=o((function(){var n=b(Mn,Dn[v],In(k)),r=b(Mn,In(k));switch(N){case"loading":return e.createElement("span",{className:n},e.createElement(S,{glyph:"Refresh",color:g?oe.blue.light1:oe.blue.base,className:zn}),u);case"error":return e.createElement(K,{className:r},e.createElement(S,{glyph:"Warning",color:g?oe.red.light1:oe.red.base}),e.createElement("span",null,d));default:return i&&"object"===ge(i)&&"length"in i&&i.length>0?e.createElement("ul",{className:Sn},i):e.createElement("span",{className:n},p)}}),[v,k,N,g,u,d,i,p]);return e.createElement(T,{active:C&&!x,spacing:4,align:"bottom",justify:"middle",refEl:l,adjustOnMutation:!0,className:b(En(s),Cn[v])},e.createElement("div",{ref:O,id:a,role:"listbox","aria-labelledby":c,"aria-expanded":C,className:b(Nn,Ln(v),m(On||(On=we(["\n max-height: ",";\n "])),M)),onMouseDownCapture:function(e){return e.preventDefault()}},D))}));An.displayName="ComboboxMenu";var Fn,Wn,Pn,Rn,Tn,Gn,Hn,Vn,Kn,Bn,Zn,Un,qn,Xn,$n,Jn,Qn,Yn,_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:de(t),displayName:null!==(n=null!=t?t:r)&&void 0!==n?n:""}},tr=function n(r){return e.Children.toArray(r).reduce((function(e,r){if(P(r,"ComboboxOption")){var t=rr(r.props),o=t.value,i=t.displayName,a=r.props,l=a.glyph,c=a.disabled;return[].concat(Ee(e),[{value:o,displayName:i,isDisabled:!!c,hasGlyph:!!l}])}if(P(r,"ComboboxGroup")){var s=r.props.children;if(s)return[].concat(Ee(e),Ee(n(s)))}}),[])},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(Fn||(Fn=we(["\n .",", ."," {\n font-size: ","px;\n line-height: 20px;\n }\n"])),ae,le,Q.body2.fontSize),lr=ve(ve(ve(ve({},ze,m(Wn||(Wn=we(["\n min-width: ","px;\n "])),Y[3])),Ae,m(Pn||(Pn=we(["\n min-width: ","px;\n "])),Y[3])),Fe,m(Rn||(Rn=we(["\n min-width: ","px;\n "])),Y[3])),We,m(Tn||(Tn=we(["\n min-width: ","px;\n "])),Y[4])),cr=m(Gn||(Gn=we(["\n pointer-events: none;\n gap: 0;\n\n label {\n gap: 0;\n align-items: center;\n }\n"])));m(Hn||(Hn=we(["\n pointer-events: none;\n"])));var sr=function(e){return m(Vn||(Vn=we(["\n font-weight: ",";\n"])),e?_.bold:_.regular)},ur=ve(ve({},W.Light,m(Kn||(Kn=we(["\n color: ",";\n "])),oe.gray.dark1)),W.Dark,m(Bn||(Bn=we(["\n color: ",";\n "])),oe.gray.base)),dr=ve(ve({},W.Light,m(Zn||(Zn=we(["\n color: ",";\n "])),oe.blue.dark1)),W.Dark,m(Un||(Un=we(["\n color: ",";\n "])),oe.blue.light3)),pr=ve(ve({},W.Light,m(qn||(qn=we(["\n color: ",";\n "])),oe.gray.light1)),W.Dark,m(Xn||(Xn=we(["\n color: ",";\n "])),oe.gray.dark1)),fr=ve(ve({},W.Light,m($n||($n=we(["\n color: ",";\n "])),oe.blue.base)),W.Dark,m(Jn||(Jn=we(["\n color: ",";\n "])),oe.blue.light1)),hr=ve(ve({},W.Light,m(Qn||(Qn=we(["\n color: ",";\n "])),oe.gray.light1)),W.Dark,m(Yn||(Yn=we(["\n color: ",";\n "])),oe.gray.dark1)),mr=m(_n||(_n=we(["\n ."," {\n align-self: baseline;\n position: relative;\n // aligns the checkbox with the option name\n top: 1px;\n }\n"])),ce),br=m(er||(er=we(["\n ."," {\n // aligns the checkbox with the option name\n top: 3px;\n }\n"])),ce),gr=["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,s=n.isFocused,u=n.setSelected,d=n.className,p=n.description,f=n.value,h=n.onClick,m=n.disabled,g=void 0!==m&&m,v=xe(n,gr),y=j(),x=y.darkMode,E=y.theme,C=r($e),N=C.multiselect,O=C.size,L=C.withIcons,D=C.inputValue,I=w(t,null),z=k({prefix:"combobox-option-text"}),A=i((function(e){e.stopPropagation(),g||(u(),null==h||h(e,f))}),[g,h,u,f]),F=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,s=n.multiselect,u=n.theme,d=n.isFocused;o&&!M(o)&&console.error("`ComboboxOption` instance did not render icon because it is not a known glyph element.",o);var p=o&&M(o)?e.cloneElement(o,me(me({},o.props),{},{className:b(ur[u],ve(ve({},dr[u],d),pr[u],a),o.props.className)})):e.createElement(e.Fragment,null),f=e.createElement(fe,{"aria-labelledby":i,checked:t,tabIndex:-1,disabled:a,darkMode:l,className:cr}),h=e.createElement(S,{glyph:"Checkmark",className:b(lr[c],fr[u],ve({},hr[u],a))});return{leftGlyph:s?r?p:f:r?p:t?h:null,rightGlyph:s?r&&f:r&&t&&h}}({withIcons:L,isSelected:l,glyph:a,theme:E,darkMode:x,size:O,disabled:g,multiselect:N,optionTextId:z,isFocused:s})}),[x,g,a,l,N,z,O,E,L,s]),W=F.leftGlyph,P=F.rightGlyph,R=N&&!L;return e.createElement(se,ye({},v,{as:"li",ref:I,highlighted:s,disabled:g,"aria-label":c,darkMode:x,className:b(ve(ve(ve({},ar,O===We),mr,R),br,R&&O===We),d),onClick:A,onKeyDown:A}),e.createElement(ue,{leftGlyph:W,rightGlyph:P,description:p},e.createElement("span",{id:z,className:sr(l)},function(n,r,t){if(r&&t){var o=pe(r),i=new RegExp(o,"gi"),a=n.matchAll(i);if(a){for(var l=n.split(""),c=0,s=Array.from(a);c<s.length;c++){var u,d=s[c],p=null!==(u=d.index)&&void 0!==u?u:-1,f=d[0],h=f.length,m=p+f+h,b=new Array(h).fill("");b[0]=e.createElement(t,{key:m},f),l.splice.apply(l,[p,h].concat(Ee(b)))}return e.createElement(e.Fragment,null,l)}return e.createElement(e.Fragment,null,n)}return e.createElement(e.Fragment,null,n)}(c,D,"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,Nr,Or,Lr,Sr,Mr,Dr,Ir,jr,zr,Ar,Fr,Wr,Pr,Rr,Tr,Gr,Hr,Vr,Kr,Br,Zr,Ur,qr,Xr,$r,Jr,Qr,Yr,_r=function(e){return!h(e)&&!p(e)&&(f(e)||u(e)&&e.length>0)},et=function(e){return Qe[e]+2*_e[e]},nt=Y[100],rt=ve(ve(ve(ve({},ze,22),Ae,28),Fe,36),We,48),tt=function(e){return(rt[e]-et(e)-2)/2},ot=ve(ve(ve(ve({},ze,{y:tt(ze),xLeftWithChip:Y[25],xLeftWithoutChip:Y[200],xRight:Y[100]}),Ae,{y:tt(Ae),xLeftWithChip:Y[100],xLeftWithoutChip:Y[200],xRight:Y[100]}),Fe,{y:tt(Fe),xLeftWithChip:Y[150],xLeftWithoutChip:Y[300],xRight:Y[200]}),We,{y:tt(We),xLeftWithChip:Y[300],xLeftWithoutChip:Y[300],xRight:Y[200]}),it=Y[400],at=function(e){return m(xr||(xr=we(["\n font-family: ",";\n width: 100%;\n min-width: ","px;\n "])),ee.default,Ye[e]+2*ot[e].xLeftWithChip+it+2)},lt=m(wr||(wr=we(["\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"])),Y[200],re.default,re.default),ct=ve(ve({},W.Light,m(kr||(kr=we(["\n color: ",";\n background-color: ",";\n "])),ne.light.text.primary.default,ne.light.background.primary.default)),W.Dark,m(Er||(Er=we(["\n color: ",";\n background-color: ",";\n "])),ne.dark.text.primary.default,oe.gray.dark4)),st=function(e,n){return m(Cr||(Cr=we(["\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)},ut=function(e){return m(Nr||(Nr=we(["\n cursor: not-allowed;\n color: ",";\n background-color: ",";\n border-color: ",";\n"])),ne[e].text.disabled.default,ne[e].background.disabled.default,ne[e].border.disabled.default)},dt=function(e){return ve(ve(ve({},Te.Error,m(Or||(Or=we(["\n border-color: ",";\n "])),ne[e].border.error.default)),Te.None,m(Lr||(Lr=we(["\n border-color: ",";\n "])),ne[e].border.primary.default)),Te.Valid,m(Sr||(Sr=we(["\n border-color: ",";\n "])),ne[e].border.success.default))},pt=ve(ve({},W.Light,m(Mr||(Mr=we(["\n &:focus-within {\n border-color: transparent;\n box-shadow: ",";\n }\n "])),te[W.Light].input)),W.Dark,m(Dr||(Dr=we(["\n &:focus-within {\n border-color: transparent;\n box-shadow: ",";\n }\n "])),te[W.Dark].input)),ft=m(Ir||(Ir=we(["\n display: flex;\n align-items: center;\n"]))),ht=ve(ve(ve(ve({},ze,m(jr||(jr=we(["\n gap: ","px;\n "])),Y[100])),Ae,m(zr||(zr=we(["\n gap: ","px;\n "])),Y[200])),Fe,m(Ar||(Ar=we(["\n gap: ","px;\n "])),Y[200])),We,m(Fr||(Fr=we(["\n gap: ","px;\n "])),Y[200])),mt=function(e){var n=e.overflow,r=e.size,t=m(Wr||(Wr=we(["\n flex-grow: 1;\n width: 100%;\n "])));switch(n){case Re:return m(Pr||(Pr=we(["\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),Je);case Pe:return m(Rr||(Rr=we(["\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)}},bt=m(Tr||(Tr=we(["\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"])),ee.default,Y[100]),gt=ve(ve({},W.Light,m(Gr||(Gr=we(["\n &::placeholder {\n color: ",";\n }\n "])),oe.gray.base)),W.Dark,m(Hr||(Hr=we(["\n &::placeholder {\n color: ",";\n }\n "])),oe.gray.dark1)),vt=ve(ve({},W.Light,m(Vr||(Vr=we(["\n &::placeholder {\n color: ",";\n }\n "])),oe.gray.base)),W.Dark,m(Kr||(Kr=we(["\n &::placeholder {\n color: ",";\n }\n "])),oe.gray.dark1)),yt=function(e){return m(Br||(Br=we(["\n height: ","px;\n font-size: ","px;\n line-height: ","px;\n min-width: ","px;\n"])),et(e),Ye[e],Qe[e],Ye[e])},xt=function(e){return m(Zr||(Zr=we(["\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(Ur||(Ur=we(["\n width: ","px;\n max-width: 100%;\n "])),t*Ye[e])},kt=m(qr||(qr=we(["\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(Xr||(Xr=we(["\n height: ","px;\n width: ","px;\n"])),it,it),Ct=m($r||($r=we(["\n margin-bottom: ","px;\n display: flex;\n flex-direction: column;\n"])),Y[100]),Nt=m(Jr||(Jr=we(["\n font-size: ","px;\n line-height: ","px;\n"])),Q.large.fontSize,Q.large.lineHeight),Ot=ve(ve({},W.Light,m(Qr||(Qr=we(["\n ::after {\n box-shadow: 0px 0px 7px 5px ",";\n }\n "])),ie(.85,oe.black))),W.Dark,m(Yr||(Yr=we(["\n ::after {\n width: 95%;\n box-shadow: 0px -7px 12px 5px rgb(0 0 0 / 50%);\n }\n "])))),Lt=function(e){return ne[e].icon.primary.default},St=function(e){return ne[e].icon.disabled.default},Mt=["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"],Dt=["className","glyph","disabled"];function It(n){var r=n.children,m=n.label,g=n.description,v=n.placeholder,w=void 0===v?"Select":v,E=n["aria-label"],M=n.disabled,A=void 0!==M&&M,W=n.size,T=void 0===W?Fe:W,K=n.darkMode,U=n.state,q=void 0===U?"none":U,X=n.errorMessage,$=void 0===X?y.error:X,J=n.successMessage,Q=void 0===J?y.success:J,Y=n.searchState,_=void 0===Y?"unset":Y,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,se=void 0===ce||ce,ue=n.onClear,de=n.overflow,pe=void 0===de?Pe:de,fe=n.multiselect,he=void 0!==fe&&fe,be=n.initialValue,we=n.inputValue,Ee=n.onInputChange,Ce=n.onChange,Ne=n.value,ze=n.chipTruncationLocation,Ae=n.chipCharacterLimit,Te=void 0===Ae?12:Ae,Ge=n.className,He=n.renderMode,Ve=void 0===He?G.TopLayer:He,Ke=n.portalClassName,Be=n.portalContainer,Ze=n.portalRef,Ue=n.scrollContainer,qe=n.popoverZIndex,Xe=xe(n,Mt),Je=j(K),Qe=Je.darkMode,Ye=Je.theme,_e=C({prefix:"option"}),en=C({prefix:"chip"}),rn=k({prefix:"combobox-input"}),tn=k({prefix:"combobox-label"}),on=k({prefix:"combobox-menu"}),an=a(null),ln=a(null),cn=a(null),sn=a(null),un=a(null),dn=ke(l(!1),2),pn=dn[0],fn=dn[1],hn=N(pn),mn=ke(l(null),2),bn=mn[0],gn=mn[1],vn=ke(l(null),2),yn=vn[0],wn=vn[1],kn=N(yn),En=ke(l(null!=we?we:""),2),Cn=En[0],Nn=En[1];t((function(){h(we)||Nn(we)}),[we]);var On=function(e){Nn(e)},Ln=N(Cn),Sn=ke(l(null),2),Mn=Sn[0],Dn=Sn[1],In=ke(l(!1),2),jn=In[0],zn=In[1],Fn=he&&u(yn)&&yn.length>0?void 0:w,Wn=function(){return fn(!1)},Pn=function(){return fn(!0)},Rn=o((function(){return tr(r)}),[r]),Tn=i((function(e){return!he||"string"!=typeof e&&"number"!=typeof e?!he&&u(e)&&R.error("Error in Combobox: multiselect is set to `false`, but received an Array value"):R.error("Error in Combobox: multiselect is set to `true`, but received a ".concat(ge(e),' value: "').concat(e,'"')),he&&u(e)}),[he]),Gn=i((function(e){!A&&sn&&sn.current&&(sn.current.focus(),h(e)||sn.current.setSelectionRange(e,e))}),[A]),Hn=i((function(e){if(Tn(yn)){var n=c(yn),r=Ce,t={diffType:"delete",value:null!=e?e:yn};p(e)?n.length=0:yn.includes(e)?n.splice(n.indexOf(e),1):(n.push(e),t.diffType="insert",On("")),wn(n),null==r||r(n,t)}else{var o=e,i=Ce;wn(o),null==i||i(o)}}),[Tn,Ce,yn]),Vn=i((function(e){var n,r,t,o;return function(e,n){return Array.isArray(n)?n.includes(e):e===n}((r=Rn,(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:""),yn)}),[Rn,yn]),Kn=i((function(e){var n="string"==typeof e?e:e.value;return ae&&ae.length>0?ae.includes(n):!!Vn(Cn)||("string"==typeof e?ir(n,Rn):e.displayName).toLowerCase().includes(Cn.toLowerCase())}),[ae,Vn,Cn,Rn]),Bn=o((function(){return Rn.filter(Kn)}),[Rn,Kn]),Zn=i((function(e){return!!e&&!!Rn.find((function(n){return n.value===e}))}),[Rn]),Un=i((function(e){return Bn?Bn.findIndex((function(n){return n.value===e})):-1}),[Bn]),qn=i((function(e){if(Bn&&Bn.length>=e){var n=Bn[e];return n?n.value:void 0}}),[Bn]),Xn=i((function(){return Tn(yn)?yn.findIndex((function(e){var n;return null===(n=en(e))||void 0===n||null===(n=n.current)||void 0===n?void 0:n.contains(document.activeElement)})):-1}),[en,Tn,yn]),$n=ke(l(),2),Jn=$n[0],Qn=$n[1],Yn=i((function(e){var n,r=null!==(n=null==Bn?void 0:Bn.length)&&void 0!==n?n:0,t=r-1>0?r-1:0,o=Un(bn);switch(e&&pn&&(Dn(null),Gn()),e){case"next":var i=qn(o+1<r?o+1:0);gn(null!=i?i:null);break;case"prev":var a=qn(o-1>=0?o-1:t);gn(null!=a?a:null);break;case"last":var l=qn(t);gn(null!=l?l:null);break;default:var c=qn(0);gn(null!=c?c:null)}}),[bn,Un,qn,pn,Gn,null==Bn?void 0:Bn.length]),_n=i((function(e,n){if(Tn(yn))switch(e){case"next":var r=null!=n?n:Xn(),t=r+1<yn.length?r+1:yn.length-1,o=yn[t];Dn(o);break;case"prev":var i=null!=n?n:Xn(),a=i>0?i-1:i<0?yn.length-1:0,l=yn[a];Dn(l);break;case"first":var c=yn[0];Dn(c);break;case"last":var s=yn[yn.length-1];Dn(s);break;default:Dn(null)}}),[Xn,Tn,yn]),er=i((function(e,n){switch(e&&gn(null),e){case"right":switch(Jn){case Oe: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=ln.current)||void 0===o||o.focus();break;case Se:case De:case Me:if(Jn===Me||1===(null==yn?void 0:yn.length)){Gn(0),_n(null),n.preventDefault();break}_n("next")}break;case"left":switch(Jn){case Le:var i;n.preventDefault(),Gn(null==sn||null===(i=sn.current)||void 0===i?void 0:i.value.length);break;case Oe:case De:case Me:if(Tn(yn)){var a;if(Jn===Oe&&0!==(null===(a=sn.current)||void 0===a?void 0:a.selectionStart))break;_n("prev")}}break;default:_n(null)}}),[Jn,Tn,yn,Gn,_n]);t((function(){Cn!==Ln&&Yn("first")}),[Cn,pn,Ln,Yn]),O(bn?_e(bn):void 0,un);var ar=i((function(n){if(P(n,"ComboboxOption")){var r=rr(n.props),t=r.value,o=r.displayName;if(Kn(t)){var i=n.props,a=i.className,l=i.glyph,c=i.disabled,s=xe(i,Dt),u=Rn.findIndex((function(e){return e.value===t})),d=bn===t,p=Tn(yn)?yn.includes(t):yn===t,f=_e(t);return e.createElement(vr,ye({},s,{value:t,displayName:o,isFocused:d,isSelected:p,disabled:c,setSelected:function(){gn(t),Hn(t),Gn(),t===yn&&Wn()},glyph:l,className:a,index:u,ref:f}))}}else if(P(n,"ComboboxGroup")){var h=e.Children.map(n.props.children,ar);if(h&&(null==h?void 0:h.length)>0)return e.createElement(xn,{label:n.props.label,className:n.props.className},e.Children.map(h,ar))}}),[Rn,_e,bn,Tn,yn,Gn,Kn,Hn]),lr=o((function(){return e.Children.map(r,ar)}),[r,ar]),cr=o((function(){if(Tn(yn))return yn.filter(Zn).map((function(n,r){var t=ir(n,Rn),o=Mn===n,i=en(n),a=r>=yn.length-1;return e.createElement(nn,{key:n,displayName:t,isFocused:o,onRemove:function(){a?(Gn(),_n(null)):_n("next",r),Hn(n)},onFocus:function(){Dn(n)},ref:i})}))}),[Tn,yn,Zn,Rn,Mn,en,Hn,Gn,_n]),sr=o((function(){return Rn.some((function(e){return e.hasGlyph}))}),[Rn]),ur=i((function(){var e=Bn.find((function(e){return e.displayName===Cn||e.value===Cn}));if(!Ne&&e)Hn(e.value);else if(!Tn(yn)){var n,r=null!==(n=ir(yn,Rn))&&void 0!==n?n:kn;On(r)}}),[Rn,Cn,Tn,kn,yn,Hn,Ne,Bn]),dr=i((function(){if(_r(yn)){if(Tn(yn))kr(pe);else if(!Tn(yn)){var e,n=null!==(e=ir(yn,Rn))&&void 0!==e?e:"";On(n),Wn()}}else On("")}),[Rn,Tn,yn,pe]);t((function(){if(be)if(u(be)){var e,n=null!==(e=be.filter((function(e){return Zn(e)})))&&void 0!==e?e:[];wn(n)}else Zn(be)&&wn(be);else wn(function(e){return e?[]:null}(he))}),[]),t((function(){if(!h(Ne)&&Ne!==Ln)if(p(Ne))wn(null);else if(Tn(Ne)){var e=Ne.filter(Zn);wn(e)}else wn(Zn(Ne)?Ne:null)}),[Tn,Zn,Ln,Ne]),t((function(){!h(kn)&&(u(yn)&&!p(kn)||f(yn)||p(yn))&&!d(yn,kn)&&dr()}),[dr,kn,yn]),t((function(){!pn&&hn&&ur()}),[pn,hn,ur]);var pr=ke(l(0),2),fr=pr[0],hr=pr[1];t((function(){var e,n;hr(null!==(e=null===(n=an.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)}),[an,pn,bn,yn]);L(Wn,[un,an],pn);var mr=Tn(yn)&&!!yn.length,br=s((function(e){zn(nr(e.target))}),50,{leading:!0}),gr=i((function(e){pe===Pe&&br(e)}),[br,pe]);t((function(){cn.current&&zn(nr(cn.current))}),[]);var yr,xr=me({popoverZIndex:qe},H({dismissMode:V.Manual,portalClassName:Ke,portalContainer:Be,portalRef:Ze,renderMode:Ve,scrollContainer:Ue})),wr={disabled:A,errorMessage:$,size:T,state:q,successMessage:Q};return e.createElement(I,{darkMode:Qe},e.createElement($e.Provider,{value:{multiselect:he,size:T,withIcons:sr,disabled:A,isOpen:pn,state:q,searchState:_,chipTruncationLocation:ze,chipCharacterLimit:Te,inputValue:Cn,overflow:pe,popoverZIndex:qe}},e.createElement("div",ye({className:b(at(T),Ge)},Xe),(m||g)&&e.createElement("div",{className:Ct},m&&e.createElement(B,{id:tn,htmlFor:rn,darkMode:Qe,disabled:A,className:b(ve({},Nt,T===We))},m),g&&e.createElement(Z,{darkMode:Qe,disabled:A,className:b(ve({},Nt,T===We))},g)),e.createElement("div",{ref:an,role:"combobox","aria-expanded":pn,"aria-controls":on,"aria-owns":on,tabIndex:-1,onMouseDown:function(e){A&&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?Cn.length:0;Gn(n)}Pn()},onFocus:function(e){kr(pe),Qn(function(e){var n,r,t,o;if(!e)return;if(null!==(n=sn.current)&&void 0!==n&&n.contains(e))return Oe;if(null!==(r=ln.current)&&void 0!==r&&r.contains(e))return Le;var i=Tn(yn)?yn.findIndex((function(n){var r;return null===(r=en(n))||void 0===r||null===(r=r.current)||void 0===r?void 0:r.contains(e)})):-1;if(Tn(yn)){if(0===i)return Se;if(i===yn.length-1)return Me;if(i>0)return De}if(null!==(t=un.current)&&void 0!==t&&t.contains(e))return je;if(null!==(o=an.current)&&void 0!==o&&o.contains(e))return Ie}(e.target))},onKeyDown:function(e){var n,r,t=null===(n=un.current)||void 0===n?void 0:n.contains(document.activeElement);if((null===(r=an.current)||void 0===r?void 0:r.contains(document.activeElement))||t){if(e.ctrlKey||e.shiftKey||e.altKey)return;switch(e.key){case F.Tab:switch(Jn){case"Input":_r(yn)||(Wn(),Yn("first"),_n(null));break;case"LastChip":_n(null)}break;case F.Escape:Wn(),Yn("first");break;case F.Enter:pn?!pn||Jn!==Oe||p(bn)||function(e){if("string"==typeof e){var n=or(e,Rn);return!(null==n||!n.isDisabled)}return!!e.isDisabled}(bn)?Jn===Le&&(Hn(null),Gn()):Hn(bn):Pn();break;case F.Backspace:var o;if(Tn(yn))"Input"===Jn&&0===(null===(o=sn.current)||void 0===o?void 0:o.selectionStart)&&_n("last");Pn();break;case F.ArrowDown:pn?(e.preventDefault(),Yn("next")):Pn();break;case F.ArrowUp:pn?(e.preventDefault(),Yn("prev")):Pn();break;case F.ArrowRight:er("right",e);break;case F.ArrowLeft:er("left",e);break;default:pn||Pn()}}},onTransitionEnd:function(){var e,n;hr(null!==(e=null===(n=an.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)},className:b(lt,ct[Ye],st(T,mr),dt(Ye)[q],ve(ve(ve({},pt[Ye],(yr=Oe,yr===Jn)),ut(Ye),A),Ot[Ye],jn))},e.createElement("div",{onScroll:gr,ref:cn,className:mt({size:T,overflow:pe})},cr,e.createElement("input",{"aria-label":null!=E?E:m,"aria-autocomplete":"list","aria-controls":on,"aria-labelledby":tn,ref:sn,id:rn,className:b(bt,yt(T),gt[Ye],xt(pn),ve(ve({},wt(T,Cn),Tn(yn)),vt[Ye],A)),placeholder:Fn,"aria-disabled":A,readOnly:A,onChange:function(e){On(e.target.value),null==le||le(e.target.value),null==Ee||Ee(e)},value:Cn,autoComplete:"off"})),e.createElement("div",{className:b(ft,ht[T])},se&&_r(yn)&&!A&&e.createElement(D,{"aria-label":"Clear selection",disabled:A,ref:ln,onClick:function(e){A||(e.stopPropagation(),Hn(null),null==ue||ue(e),null==le||le(""),Gn())},onFocus:function(){gn(null)},className:b(kt),darkMode:Qe},e.createElement(S,{glyph:"XWithCircle"})),e.createElement(S,{glyph:"CaretDown",className:Et,fill:b(ve(ve({},Lt(Ye),!A),St(Ye),A))}))),e.createElement(x,wr),e.createElement(z,xr,e.createElement(An,{id:on,labelId:tn,refEl:an,ref:un,menuWidth:fr,searchLoadingMessage:ie,searchErrorMessage:te,searchEmptyMessage:ne},lr)))));function kr(e){cn&&cn.current&&(e===Re&&(cn.current.scrollLeft=cn.current.scrollWidth),e===Pe&&(cn.current.scrollTop=cn.current.scrollHeight))}}export{It as Combobox,wn as ComboboxGroup,yr as ComboboxOption};
|
|
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 s from"lodash/debounce";import u from"lodash/isArray";import d from"lodash/isEqual";import p from"lodash/isNull";import f from"lodash/isString";import h from"lodash/isUndefined";import{css as m,cx as b,keyframes as g}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 N,useAutoScroll as O,useBackdropClick as L}from"@leafygreen-ui/hooks";import S,{isComponentGlyph as M}from"@leafygreen-ui/icon";import D from"@leafygreen-ui/icon-button";import I,{useDarkMode as j,PopoverPropsProvider as z}from"@leafygreen-ui/leafygreen-provider";import{createUniqueClassName as A,keyMap as F,Theme as W,isComponentType as P,consoleOnce as R}from"@leafygreen-ui/lib";import T,{RenderMode as G,getPopoverRenderModeProps as H,DismissMode as V}from"@leafygreen-ui/popover";import{Error as K,Label as B,Description as Z}from"@leafygreen-ui/typography";import{chipTextClassName as U,TruncationLocation as q,Chip as X,BaseFontSize as $,Variant as J}from"@leafygreen-ui/chip";import{typeScales as Q,spacing as Y,fontWeights as _,fontFamilies as ee,color as ne,transitionDuration as re,focusRing as te}from"@leafygreen-ui/tokens";import{palette as oe}from"@leafygreen-ui/palette";import{transparentize as ie}from"polished";import{descriptionClassName as ae,titleClassName as le,leftGlyphClassName as ce,InputOption as se,InputOptionContent as ue}from"@leafygreen-ui/input-option";import de from"lodash/kebabCase";import pe from"lodash/escapeRegExp";import fe from"@leafygreen-ui/checkbox";function he(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 me(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?he(Object(r),!0).forEach((function(n){ve(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):he(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))}))}return e}function be(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+""}function ge(e){return ge="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},ge(e)}function ve(e,n,r){return(n=be(n))in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function ye(){return ye=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},ye.apply(this,arguments)}function xe(e,n){if(null==e)return{};var r,t,o=function(e,n){if(null==e)return{};var r,t,o={},i=Object.keys(e);for(t=0;t<i.length;t++)r=i[t],n.indexOf(r)>=0||(o[r]=e[r]);return o}(e,n);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(t=0;t<i.length;t++)r=i[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function we(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function ke(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,s=!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){s=!0,o=e}finally{try{if(!c&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(s)throw o}}return l}}(e,n)||Ce(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 Ee(e){return function(e){if(Array.isArray(e))return Ne(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||Ce(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,n){if(e){if("string"==typeof e)return Ne(e,n);var r=Object.prototype.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)?Ne(e,n):void 0}}function Ne(e,n){(null==n||n>e.length)&&(n=e.length);for(var r=0,t=new Array(n);r<n;r++)t[r]=e[r];return t}var Oe="Input",Le="ClearButton",Se="FirstChip",Me="LastChip",De="MiddleChip",Ie="Combobox",je="Menu",ze="xsmall",Ae="small",Fe="default",We="large",Pe="expand-y",Re="scroll-x",Te=v;var Ge,He,Ve,Ke,Be,Ze,Ue,qe,Xe,$e=n({multiselect:!1,size:Fe,withIcons:!1,disabled:!1,isOpen:!1,state:Te.None,searchState:"unset",overflow:Pe}),Je=A("combobox-chip"),Qe=ve(ve(ve(ve({},ze,16),Ae,Q.body1.lineHeight),Fe,Q.body1.lineHeight),We,Q.body2.lineHeight),Ye=ve(ve(ve(ve({},ze,Q.body1.fontSize),Ae,Q.body1.fontSize),Fe,Q.body1.fontSize),We,Q.body2.fontSize),_e=ve(ve(ve(ve({},ze,1),Ae,0),Fe,2),We,4),en=ve(ve(ve(ve({},ze,m(Ge||(Ge=we(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),Ye[ze],Qe[ze],U,_e[ze])),Ae,m(He||(He=we(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),Ye[Ae],Qe[Ae],U,_e[Ae])),Fe,m(Ve||(Ve=we(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-block: ","px;\n }\n "])),Ye[Fe],Qe[Fe],U,_e[Fe])),We,m(Ke||(Ke=we(["\n font-size: ","px;\n line-height: ","px;\n\n ."," {\n padding-inline-end: 10px;\n padding-block: ","px;\n }\n "])),Ye[We],Qe[We],U,_e[We])),nn=e.forwardRef((function(n,o){var i,a=n.displayName,l=n.isFocused,c=n.onRemove,s=n.onFocus,u=r($e),d=u.size,p=u.disabled,f=u.overflow,h=u.chipTruncationLocation,m=void 0===h?q.End:h,g=u.chipCharacterLimit,v=void 0===g?12:g,y=f===Re?q.None:m,x=w(o,null),k=null===(i=x.current)||void 0===i?void 0:i.querySelector("button");t((function(){l&&!p&&(null==k||k.focus())}),[p,k,l]);return e.createElement(X,{label:a,className:b(Je,en[d]),role:"option","aria-selected":l,"data-testid":"lg-combobox-chip",onClick:function(e){null!=k&&k.contains(e.target)||s()},onKeyDown:function(e){p||e.key!==F.Delete&&e.key!==F.Backspace&&e.key!==F.Enter&&e.key!==F.Space||c()},onDismiss:function(){p||c()},baseFontSize:$.Body1,chipCharacterLimit:v,chipTruncationLocation:y,variant:J.Gray,ref:x,disabled:p,tabIndex:-1})}));nn.displayName="ComboboxChip";var rn,tn,on,an,ln,cn,sn,un,dn,pn,fn,hn,mn,bn,gn=ve(ve({},W.Light,m(Be||(Be=we(["\n padding-top: ","px;\n "])),Y[2])),W.Dark,m(Ze||(Ze=we(["\n padding-top: ","px;\n "])),Y[2])),vn=m(Ue||(Ue=we(["\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"])),_.bold),yn=ve(ve({},W.Light,m(qe||(qe=we(["\n color: ",";\n "])),oe.gray.dark1)),W.Dark,m(Xe||(Xe=we(["\n color: ",";\n "])),oe.gray.light1));function xn(n){var r=n.label,t=n.className,o=n.children,i=j().theme,a=k({prefix:"combobox-group"});return e.Children.count(o)>0?e.createElement("div",{className:b(gn[i],t)},e.createElement("div",{className:b(vn,yn[i]),id:a},r),e.createElement("div",{role:"group","aria-labelledby":a},o)):e.createElement(e.Fragment,null)}function wn(e){throw Error("`ComboboxGroup` must be a child of a `Combobox` instance")}wn.displayName="ComboboxGroup";var kn=ve(ve(ve(ve({},ze,{x:12,y:8}),Ae,{x:12,y:8}),Fe,{x:12,y:8}),We,{x:12,y:8}),En=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:384;return m(rn||(rn=we(["\n width: ","px;\n overflow: hidden;\n border-radius: 12px;\n border: 1px solid;\n"])),e)},Cn=ve(ve({},W.Light,m(tn||(tn=we(["\n box-shadow: 0px 4px 7px ",";\n border-color: ",";\n "])),ie(.85,oe.black),oe.gray.light2)),W.Dark,m(on||(on=we(["\n box-shadow: 0px 4px 7px ",";\n border-color: ",";\n "])),ie(.85,oe.black),oe.gray.dark2)),Nn=m(an||(an=we(["\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"])),Y[2],ee.default);ve(ve({},W.Light,m(ln||(ln=we(["\n color: ",";\n background-color: ",";\n "])),oe.black,oe.white)),W.Dark,m(cn||(cn=we(["\n color: ",";\n background-color: ",";\n "])),oe.gray.light1,oe.gray.dark3));var On,Ln=function(e){return m(sn||(sn=we(["\n background-color: ",";\n"])),ne[e].background.primary.default)},Sn=m(un||(un=we(["\n position: relative;\n margin: 0;\n padding: 0;\n"]))),Mn=m(dn||(dn=we(["\n font-family: inherit;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"]))),Dn=ve(ve({},W.Light,m(pn||(pn=we(["\n color: ",";\n "])),oe.gray.dark3)),W.Dark,m(fn||(fn=we(["\n color: ",";\n "])),oe.gray.light3)),In=function(e){return m(hn||(hn=we(["\n font-size: ","px;\n line-height: ","px;\n padding: ","px ","px;\n"])),Ye[e],Qe[e],kn[e].y,kn[e].x)},jn=g(mn||(mn=we(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"]))),zn=m(bn||(bn=we(["\n animation: "," 1.5s linear infinite;\n"])),jn),An=e.forwardRef((function(n,t){var i=n.children,a=n.id,l=n.refEl,c=n.labelId,s=n.menuWidth,u=n.searchLoadingMessage,d=n.searchErrorMessage,p=n.searchEmptyMessage,f=j(),g=f.darkMode,v=f.theme,y=r($e),x=y.disabled,k=y.size,C=y.isOpen,N=y.searchState,O=w(t,null),L=E(l),M=h(L)?"unset":"".concat(Math.min(L,256),"px"),D=o((function(){var n=b(Mn,Dn[v],In(k)),r=b(Mn,In(k));switch(N){case"loading":return e.createElement("span",{className:n},e.createElement(S,{glyph:"Refresh",color:g?oe.blue.light1:oe.blue.base,className:zn}),u);case"error":return e.createElement(K,{className:r},e.createElement(S,{glyph:"Warning",color:g?oe.red.light1:oe.red.base}),e.createElement("span",null,d));default:return i&&"object"===ge(i)&&"length"in i&&i.length>0?e.createElement("ul",{className:Sn},i):e.createElement("span",{className:n},p)}}),[v,k,N,g,u,d,i,p]);return e.createElement(T,{active:C&&!x,spacing:4,align:"bottom",justify:"middle",refEl:l,adjustOnMutation:!0,className:b(En(s),Cn[v])},e.createElement("div",{ref:O,id:a,role:"listbox","aria-labelledby":c,"aria-expanded":C,className:b(Nn,Ln(v),m(On||(On=we(["\n max-height: ",";\n "])),M)),onMouseDownCapture:function(e){return e.preventDefault()}},D))}));An.displayName="ComboboxMenu";var Fn,Wn,Pn,Rn,Tn,Gn,Hn,Vn,Kn,Bn,Zn,Un,qn,Xn,$n,Jn,Qn,Yn,_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:de(t),displayName:null!==(n=null!=t?t:r)&&void 0!==n?n:""}},tr=function n(r){return e.Children.toArray(r).reduce((function(e,r){if(P(r,"ComboboxOption")){var t=rr(r.props),o=t.value,i=t.displayName,a=r.props,l=a.glyph,c=a.disabled;return[].concat(Ee(e),[{value:o,displayName:i,isDisabled:!!c,hasGlyph:!!l}])}if(P(r,"ComboboxGroup")){var s=r.props.children;if(s)return[].concat(Ee(e),Ee(n(s)))}}),[])},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(Fn||(Fn=we(["\n .",", ."," {\n font-size: ","px;\n line-height: 20px;\n }\n"])),ae,le,Q.body2.fontSize),lr=ve(ve(ve(ve({},ze,m(Wn||(Wn=we(["\n min-width: ","px;\n "])),Y[3])),Ae,m(Pn||(Pn=we(["\n min-width: ","px;\n "])),Y[3])),Fe,m(Rn||(Rn=we(["\n min-width: ","px;\n "])),Y[3])),We,m(Tn||(Tn=we(["\n min-width: ","px;\n "])),Y[4])),cr=m(Gn||(Gn=we(["\n pointer-events: none;\n gap: 0;\n\n label {\n gap: 0;\n align-items: center;\n }\n"])));m(Hn||(Hn=we(["\n pointer-events: none;\n"])));var sr=function(e){return m(Vn||(Vn=we(["\n font-weight: ",";\n"])),e?_.bold:_.regular)},ur=ve(ve({},W.Light,m(Kn||(Kn=we(["\n color: ",";\n "])),oe.gray.dark1)),W.Dark,m(Bn||(Bn=we(["\n color: ",";\n "])),oe.gray.base)),dr=ve(ve({},W.Light,m(Zn||(Zn=we(["\n color: ",";\n "])),oe.blue.dark1)),W.Dark,m(Un||(Un=we(["\n color: ",";\n "])),oe.blue.light3)),pr=ve(ve({},W.Light,m(qn||(qn=we(["\n color: ",";\n "])),oe.gray.light1)),W.Dark,m(Xn||(Xn=we(["\n color: ",";\n "])),oe.gray.dark1)),fr=ve(ve({},W.Light,m($n||($n=we(["\n color: ",";\n "])),oe.blue.base)),W.Dark,m(Jn||(Jn=we(["\n color: ",";\n "])),oe.blue.light1)),hr=ve(ve({},W.Light,m(Qn||(Qn=we(["\n color: ",";\n "])),oe.gray.light1)),W.Dark,m(Yn||(Yn=we(["\n color: ",";\n "])),oe.gray.dark1)),mr=m(_n||(_n=we(["\n ."," {\n align-self: baseline;\n position: relative;\n // aligns the checkbox with the option name\n top: 1px;\n }\n"])),ce),br=m(er||(er=we(["\n ."," {\n // aligns the checkbox with the option name\n top: 3px;\n }\n"])),ce),gr=["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,s=n.isFocused,u=n.setSelected,d=n.className,p=n.description,f=n.value,h=n.onClick,m=n.disabled,g=void 0!==m&&m,v=xe(n,gr),y=j(),x=y.darkMode,E=y.theme,C=r($e),N=C.multiselect,O=C.size,L=C.withIcons,D=C.inputValue,I=w(t,null),z=k({prefix:"combobox-option-text"}),A=i((function(e){e.stopPropagation(),g||(u(),null==h||h(e,f))}),[g,h,u,f]),F=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,s=n.multiselect,u=n.theme,d=n.isFocused;o&&!M(o)&&console.error("`ComboboxOption` instance did not render icon because it is not a known glyph element.",o);var p=o&&M(o)?e.cloneElement(o,me(me({},o.props),{},{className:b(ur[u],ve(ve({},dr[u],d),pr[u],a),o.props.className)})):e.createElement(e.Fragment,null),f=e.createElement(fe,{"aria-labelledby":i,checked:t,tabIndex:-1,disabled:a,darkMode:l,className:cr}),h=e.createElement(S,{glyph:"Checkmark",className:b(lr[c],fr[u],ve({},hr[u],a))});return{leftGlyph:s?r?p:f:r?p:t?h:null,rightGlyph:s?r&&f:r&&t&&h}}({withIcons:L,isSelected:l,glyph:a,theme:E,darkMode:x,size:O,disabled:g,multiselect:N,optionTextId:z,isFocused:s})}),[x,g,a,l,N,z,O,E,L,s]),W=F.leftGlyph,P=F.rightGlyph,R=N&&!L;return e.createElement(se,ye({},v,{as:"li",ref:I,highlighted:s,disabled:g,"aria-label":c,darkMode:x,className:b(ve(ve(ve({},ar,O===We),mr,R),br,R&&O===We),d),onClick:A,onKeyDown:A}),e.createElement(ue,{leftGlyph:W,rightGlyph:P,description:p},e.createElement("span",{id:z,className:sr(l)},function(n,r,t){if(r&&t){var o=pe(r),i=new RegExp(o,"gi"),a=n.matchAll(i);if(a){for(var l=n.split(""),c=0,s=Array.from(a);c<s.length;c++){var u,d=s[c],p=null!==(u=d.index)&&void 0!==u?u:-1,f=d[0],h=f.length,m=p+f+h,b=new Array(h).fill("");b[0]=e.createElement(t,{key:m},f),l.splice.apply(l,[p,h].concat(Ee(b)))}return e.createElement(e.Fragment,null,l)}return e.createElement(e.Fragment,null,n)}return e.createElement(e.Fragment,null,n)}(c,D,"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,Nr,Or,Lr,Sr,Mr,Dr,Ir,jr,zr,Ar,Fr,Wr,Pr,Rr,Tr,Gr,Hr,Vr,Kr,Br,Zr,Ur,qr,Xr,$r,Jr,Qr,Yr,_r=function(e){return!h(e)&&!p(e)&&(f(e)||u(e)&&e.length>0)},et=function(e){return Qe[e]+2*_e[e]},nt=Y[100],rt=ve(ve(ve(ve({},ze,22),Ae,28),Fe,36),We,48),tt=function(e){return(rt[e]-et(e)-2)/2},ot=ve(ve(ve(ve({},ze,{y:tt(ze),xLeftWithChip:Y[25],xLeftWithoutChip:Y[200],xRight:Y[100]}),Ae,{y:tt(Ae),xLeftWithChip:Y[100],xLeftWithoutChip:Y[200],xRight:Y[100]}),Fe,{y:tt(Fe),xLeftWithChip:Y[150],xLeftWithoutChip:Y[300],xRight:Y[200]}),We,{y:tt(We),xLeftWithChip:Y[300],xLeftWithoutChip:Y[300],xRight:Y[200]}),it=Y[400],at=function(e){return m(xr||(xr=we(["\n font-family: ",";\n width: 100%;\n min-width: ","px;\n "])),ee.default,Ye[e]+2*ot[e].xLeftWithChip+it+2)},lt=m(wr||(wr=we(["\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"])),Y[200],re.default,re.default),ct=ve(ve({},W.Light,m(kr||(kr=we(["\n color: ",";\n background-color: ",";\n "])),ne.light.text.primary.default,ne.light.background.primary.default)),W.Dark,m(Er||(Er=we(["\n color: ",";\n background-color: ",";\n "])),ne.dark.text.primary.default,oe.gray.dark4)),st=function(e,n){return m(Cr||(Cr=we(["\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)},ut=function(e){return m(Nr||(Nr=we(["\n cursor: not-allowed;\n color: ",";\n background-color: ",";\n border-color: ",";\n"])),ne[e].text.disabled.default,ne[e].background.disabled.default,ne[e].border.disabled.default)},dt=function(e){return ve(ve(ve({},Te.Error,m(Or||(Or=we(["\n border-color: ",";\n "])),ne[e].border.error.default)),Te.None,m(Lr||(Lr=we(["\n border-color: ",";\n "])),ne[e].border.primary.default)),Te.Valid,m(Sr||(Sr=we(["\n border-color: ",";\n "])),ne[e].border.success.default))},pt=ve(ve({},W.Light,m(Mr||(Mr=we(["\n &:focus-within {\n border-color: transparent;\n box-shadow: ",";\n }\n "])),te[W.Light].input)),W.Dark,m(Dr||(Dr=we(["\n &:focus-within {\n border-color: transparent;\n box-shadow: ",";\n }\n "])),te[W.Dark].input)),ft=m(Ir||(Ir=we(["\n display: flex;\n align-items: center;\n"]))),ht=ve(ve(ve(ve({},ze,m(jr||(jr=we(["\n gap: ","px;\n "])),Y[100])),Ae,m(zr||(zr=we(["\n gap: ","px;\n "])),Y[200])),Fe,m(Ar||(Ar=we(["\n gap: ","px;\n "])),Y[200])),We,m(Fr||(Fr=we(["\n gap: ","px;\n "])),Y[200])),mt=function(e){var n=e.overflow,r=e.size,t=m(Wr||(Wr=we(["\n flex-grow: 1;\n width: 100%;\n "])));switch(n){case Re:return m(Pr||(Pr=we(["\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),Je);case Pe:return m(Rr||(Rr=we(["\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)}},bt=m(Tr||(Tr=we(["\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"])),ee.default,Y[100]),gt=ve(ve({},W.Light,m(Gr||(Gr=we(["\n &::placeholder {\n color: ",";\n }\n "])),oe.gray.base)),W.Dark,m(Hr||(Hr=we(["\n &::placeholder {\n color: ",";\n }\n "])),oe.gray.dark1)),vt=ve(ve({},W.Light,m(Vr||(Vr=we(["\n &::placeholder {\n color: ",";\n }\n "])),oe.gray.base)),W.Dark,m(Kr||(Kr=we(["\n &::placeholder {\n color: ",";\n }\n "])),oe.gray.dark1)),yt=function(e){return m(Br||(Br=we(["\n height: ","px;\n font-size: ","px;\n line-height: ","px;\n min-width: ","px;\n"])),et(e),Ye[e],Qe[e],Ye[e])},xt=function(e){return m(Zr||(Zr=we(["\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(Ur||(Ur=we(["\n width: ","px;\n max-width: 100%;\n "])),t*Ye[e])},kt=m(qr||(qr=we(["\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(Xr||(Xr=we(["\n height: ","px;\n width: ","px;\n"])),it,it),Ct=m($r||($r=we(["\n margin-bottom: ","px;\n display: flex;\n flex-direction: column;\n"])),Y[100]),Nt=m(Jr||(Jr=we(["\n font-size: ","px;\n line-height: ","px;\n"])),Q.large.fontSize,Q.large.lineHeight),Ot=ve(ve({},W.Light,m(Qr||(Qr=we(["\n ::after {\n box-shadow: 0px 0px 7px 5px ",";\n }\n "])),ie(.85,oe.black))),W.Dark,m(Yr||(Yr=we(["\n ::after {\n width: 95%;\n box-shadow: 0px -7px 12px 5px rgb(0 0 0 / 50%);\n }\n "])))),Lt=function(e){return ne[e].icon.primary.default},St=function(e){return ne[e].icon.disabled.default},Mt=["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"],Dt=["className","glyph","disabled"];function It(n){var r=n.children,m=n.label,g=n.description,v=n.placeholder,w=void 0===v?"Select":v,E=n["aria-label"],M=n.disabled,A=void 0!==M&&M,W=n.size,T=void 0===W?Fe:W,K=n.darkMode,U=n.state,q=void 0===U?"none":U,X=n.errorMessage,$=void 0===X?y.error:X,J=n.successMessage,Q=void 0===J?y.success:J,Y=n.searchState,_=void 0===Y?"unset":Y,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,se=void 0===ce||ce,ue=n.onClear,de=n.overflow,pe=void 0===de?Pe:de,fe=n.multiselect,he=void 0!==fe&&fe,be=n.initialValue,we=n.inputValue,Ee=n.onInputChange,Ce=n.onChange,Ne=n.value,ze=n.chipTruncationLocation,Ae=n.chipCharacterLimit,Te=void 0===Ae?12:Ae,Ge=n.className,He=n.renderMode,Ve=void 0===He?G.TopLayer:He,Ke=n.portalClassName,Be=n.portalContainer,Ze=n.portalRef,Ue=n.scrollContainer,qe=n.popoverZIndex,Xe=xe(n,Mt),Je=j(K),Qe=Je.darkMode,Ye=Je.theme,_e=C({prefix:"option"}),en=C({prefix:"chip"}),rn=k({prefix:"combobox-input"}),tn=k({prefix:"combobox-label"}),on=k({prefix:"combobox-menu"}),an=a(null),ln=a(null),cn=a(null),sn=a(null),un=a(null),dn=ke(l(!1),2),pn=dn[0],fn=dn[1],hn=N(pn),mn=ke(l(null),2),bn=mn[0],gn=mn[1],vn=ke(l(null),2),yn=vn[0],wn=vn[1],kn=N(yn),En=ke(l(null!=we?we:""),2),Cn=En[0],Nn=En[1];t((function(){h(we)||Nn(we)}),[we]);var On=function(e){Nn(e)},Ln=N(Cn),Sn=ke(l(null),2),Mn=Sn[0],Dn=Sn[1],In=ke(l(!1),2),jn=In[0],zn=In[1],Fn=he&&u(yn)&&yn.length>0?void 0:w,Wn=function(){return fn(!1)},Pn=function(){return fn(!0)},Rn=o((function(){return tr(r)}),[r]),Tn=i((function(e){return!he||"string"!=typeof e&&"number"!=typeof e?!he&&u(e)&&R.error("Error in Combobox: multiselect is set to `false`, but received an Array value"):R.error("Error in Combobox: multiselect is set to `true`, but received a ".concat(ge(e),' value: "').concat(e,'"')),he&&u(e)}),[he]),Gn=i((function(e){!A&&sn&&sn.current&&(sn.current.focus(),h(e)||sn.current.setSelectionRange(e,e))}),[A]),Hn=i((function(e){if(Tn(yn)){var n=c(yn),r=Ce,t={diffType:"delete",value:null!=e?e:yn};p(e)?n.length=0:yn.includes(e)?n.splice(n.indexOf(e),1):(n.push(e),t.diffType="insert",On("")),wn(n),null==r||r(n,t)}else{var o=e,i=Ce;wn(o),null==i||i(o)}}),[Tn,Ce,yn]),Vn=i((function(e){var n,r,t,o;return function(e,n){return Array.isArray(n)?n.includes(e):e===n}((r=Rn,(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:""),yn)}),[Rn,yn]),Kn=i((function(e){var n="string"==typeof e?e:e.value;return ae&&ae.length>0?ae.includes(n):!!Vn(Cn)||("string"==typeof e?ir(n,Rn):e.displayName).toLowerCase().includes(Cn.toLowerCase())}),[ae,Vn,Cn,Rn]),Bn=o((function(){return Rn.filter(Kn)}),[Rn,Kn]),Zn=i((function(e){return!!e&&!!Rn.find((function(n){return n.value===e}))}),[Rn]),Un=i((function(e){return Bn?Bn.findIndex((function(n){return n.value===e})):-1}),[Bn]),qn=i((function(e){if(Bn&&Bn.length>=e){var n=Bn[e];return n?n.value:void 0}}),[Bn]),Xn=i((function(){return Tn(yn)?yn.findIndex((function(e){var n;return null===(n=en(e))||void 0===n||null===(n=n.current)||void 0===n?void 0:n.contains(document.activeElement)})):-1}),[en,Tn,yn]),$n=ke(l(),2),Jn=$n[0],Qn=$n[1],Yn=i((function(e){var n,r=null!==(n=null==Bn?void 0:Bn.length)&&void 0!==n?n:0,t=r-1>0?r-1:0,o=Un(bn);switch(e&&pn&&(Dn(null),Gn()),e){case"next":var i=qn(o+1<r?o+1:0);gn(null!=i?i:null);break;case"prev":var a=qn(o-1>=0?o-1:t);gn(null!=a?a:null);break;case"last":var l=qn(t);gn(null!=l?l:null);break;default:var c=qn(0);gn(null!=c?c:null)}}),[bn,Un,qn,pn,Gn,null==Bn?void 0:Bn.length]),_n=i((function(e,n){if(Tn(yn))switch(e){case"next":var r=null!=n?n:Xn(),t=r+1<yn.length?r+1:yn.length-1,o=yn[t];Dn(o);break;case"prev":var i=null!=n?n:Xn(),a=i>0?i-1:i<0?yn.length-1:0,l=yn[a];Dn(l);break;case"first":var c=yn[0];Dn(c);break;case"last":var s=yn[yn.length-1];Dn(s);break;default:Dn(null)}}),[Xn,Tn,yn]),er=i((function(e,n){switch(e&&gn(null),e){case"right":switch(Jn){case Oe: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=ln.current)||void 0===o||o.focus();break;case Se:case De:case Me:if(Jn===Me||1===(null==yn?void 0:yn.length)){Gn(0),_n(null),n.preventDefault();break}_n("next")}break;case"left":switch(Jn){case Le:var i;n.preventDefault(),Gn(null==sn||null===(i=sn.current)||void 0===i?void 0:i.value.length);break;case Oe:case De:case Me:if(Tn(yn)){var a;if(Jn===Oe&&0!==(null===(a=sn.current)||void 0===a?void 0:a.selectionStart))break;_n("prev")}}break;default:_n(null)}}),[Jn,Tn,yn,Gn,_n]);t((function(){pn||Yn("first")}),[pn,Yn]),O(bn?_e(bn):void 0,un);var ar=i((function(n){if(P(n,"ComboboxOption")){var r=rr(n.props),t=r.value,o=r.displayName;if(Kn(t)){var i=n.props,a=i.className,l=i.glyph,c=i.disabled,s=xe(i,Dt),u=Rn.findIndex((function(e){return e.value===t})),d=bn===t,p=Tn(yn)?yn.includes(t):yn===t,f=_e(t);return e.createElement(vr,ye({},s,{value:t,displayName:o,isFocused:d,isSelected:p,disabled:c,setSelected:function(){gn(t),Hn(t),Gn(),t===yn&&Wn()},glyph:l,className:a,index:u,ref:f}))}}else if(P(n,"ComboboxGroup")){var h=e.Children.map(n.props.children,ar);if(h&&(null==h?void 0:h.length)>0)return e.createElement(xn,{label:n.props.label,className:n.props.className},e.Children.map(h,ar))}}),[Rn,_e,bn,Tn,yn,Gn,Kn,Hn]),lr=o((function(){return e.Children.map(r,ar)}),[r,ar]),cr=o((function(){if(Tn(yn))return yn.filter(Zn).map((function(n,r){var t=ir(n,Rn),o=Mn===n,i=en(n),a=r>=yn.length-1;return e.createElement(nn,{key:n,displayName:t,isFocused:o,onRemove:function(){a?(Gn(),_n(null)):_n("next",r),Hn(n)},onFocus:function(){Dn(n)},ref:i})}))}),[Tn,yn,Zn,Rn,Mn,en,Hn,Gn,_n]),sr=o((function(){return Rn.some((function(e){return e.hasGlyph}))}),[Rn]),ur=i((function(){var e=Bn.find((function(e){return e.displayName===Cn||e.value===Cn}));if(!Ne&&e)Hn(e.value);else if(!Tn(yn)){var n,r=null!==(n=ir(yn,Rn))&&void 0!==n?n:kn;On(r)}}),[Rn,Cn,Tn,kn,yn,Hn,Ne,Bn]),dr=i((function(){if(_r(yn)){if(Tn(yn))kr(pe);else if(!Tn(yn)){var e,n=null!==(e=ir(yn,Rn))&&void 0!==e?e:"";On(n),Wn()}}else On("")}),[Rn,Tn,yn,pe]);t((function(){if(be)if(u(be)){var e,n=null!==(e=be.filter((function(e){return Zn(e)})))&&void 0!==e?e:[];wn(n)}else Zn(be)&&wn(be);else wn(function(e){return e?[]:null}(he))}),[]),t((function(){if(!h(Ne)&&Ne!==Ln)if(p(Ne))wn(null);else if(Tn(Ne)){var e=Ne.filter(Zn);wn(e)}else wn(Zn(Ne)?Ne:null)}),[Tn,Zn,Ln,Ne]),t((function(){!h(kn)&&(u(yn)&&!p(kn)||f(yn)||p(yn))&&!d(yn,kn)&&dr()}),[dr,kn,yn]),t((function(){!pn&&hn&&ur()}),[pn,hn,ur]);var pr=ke(l(0),2),fr=pr[0],hr=pr[1];t((function(){var e,n;hr(null!==(e=null===(n=an.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)}),[an,pn,bn,yn]);L(Wn,[un,an],pn);var mr=Tn(yn)&&!!yn.length,br=s((function(e){zn(nr(e.target))}),50,{leading:!0}),gr=i((function(e){pe===Pe&&br(e)}),[br,pe]);t((function(){cn.current&&zn(nr(cn.current))}),[]);var yr,xr=me({popoverZIndex:qe},H({dismissMode:V.Manual,portalClassName:Ke,portalContainer:Be,portalRef:Ze,renderMode:Ve,scrollContainer:Ue})),wr={disabled:A,errorMessage:$,size:T,state:q,successMessage:Q};return e.createElement(I,{darkMode:Qe},e.createElement($e.Provider,{value:{multiselect:he,size:T,withIcons:sr,disabled:A,isOpen:pn,state:q,searchState:_,chipTruncationLocation:ze,chipCharacterLimit:Te,inputValue:Cn,overflow:pe,popoverZIndex:qe}},e.createElement("div",ye({className:b(at(T),Ge)},Xe),(m||g)&&e.createElement("div",{className:Ct},m&&e.createElement(B,{id:tn,htmlFor:rn,darkMode:Qe,disabled:A,className:b(ve({},Nt,T===We))},m),g&&e.createElement(Z,{darkMode:Qe,disabled:A,className:b(ve({},Nt,T===We))},g)),e.createElement("div",{ref:an,role:"combobox","aria-expanded":pn,"aria-controls":on,"aria-owns":on,tabIndex:-1,onMouseDown:function(e){A&&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?Cn.length:0;Gn(n)}Pn()},onFocus:function(e){kr(pe),Qn(function(e){var n,r,t,o;if(!e)return;if(null!==(n=sn.current)&&void 0!==n&&n.contains(e))return Oe;if(null!==(r=ln.current)&&void 0!==r&&r.contains(e))return Le;var i=Tn(yn)?yn.findIndex((function(n){var r;return null===(r=en(n))||void 0===r||null===(r=r.current)||void 0===r?void 0:r.contains(e)})):-1;if(Tn(yn)){if(0===i)return Se;if(i===yn.length-1)return Me;if(i>0)return De}if(null!==(t=un.current)&&void 0!==t&&t.contains(e))return je;if(null!==(o=an.current)&&void 0!==o&&o.contains(e))return Ie}(e.target))},onKeyDown:function(e){var n,r,t=null===(n=un.current)||void 0===n?void 0:n.contains(document.activeElement);if((null===(r=an.current)||void 0===r?void 0:r.contains(document.activeElement))||t){if(e.ctrlKey||e.shiftKey||e.altKey)return;switch(e.key){case F.Tab:switch(Jn){case"Input":_r(yn)||(Wn(),Yn("first"),_n(null));break;case"LastChip":_n(null)}break;case F.Escape:Wn(),Yn("first");break;case F.Enter:pn?!pn||Jn!==Oe||p(bn)||function(e){if("string"==typeof e){var n=or(e,Rn);return!(null==n||!n.isDisabled)}return!!e.isDisabled}(bn)?Jn===Le&&(Hn(null),Gn()):Hn(bn):Pn();break;case F.Backspace:var o;if(Tn(yn))"Input"===Jn&&0===(null===(o=sn.current)||void 0===o?void 0:o.selectionStart)&&_n("last");Pn();break;case F.ArrowDown:pn?(e.preventDefault(),Yn("next")):Pn();break;case F.ArrowUp:pn?(e.preventDefault(),Yn("prev")):Pn();break;case F.ArrowRight:er("right",e);break;case F.ArrowLeft:er("left",e);break;default:pn||Pn()}}},onTransitionEnd:function(){var e,n;hr(null!==(e=null===(n=an.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0)},className:b(lt,ct[Ye],st(T,mr),dt(Ye)[q],ve(ve(ve({},pt[Ye],(yr=Oe,yr===Jn)),ut(Ye),A),Ot[Ye],jn))},e.createElement("div",{onScroll:gr,ref:cn,className:mt({size:T,overflow:pe})},cr,e.createElement("input",{"aria-label":null!=E?E:m,"aria-autocomplete":"list","aria-controls":on,"aria-labelledby":tn,ref:sn,id:rn,className:b(bt,yt(T),gt[Ye],xt(pn),ve(ve({},wt(T,Cn),Tn(yn)),vt[Ye],A)),placeholder:Fn,"aria-disabled":A,readOnly:A,onChange:function(e){On(e.target.value),null==le||le(e.target.value),null==Ee||Ee(e)},value:Cn,autoComplete:"off"})),e.createElement("div",{className:b(ft,ht[T])},se&&_r(yn)&&!A&&e.createElement(D,{"aria-label":"Clear selection",disabled:A,ref:ln,onClick:function(e){A||(e.stopPropagation(),Hn(null),null==ue||ue(e),null==le||le(""),Gn())},onFocus:function(){gn(null)},className:b(kt),darkMode:Qe},e.createElement(S,{glyph:"XWithCircle"})),e.createElement(S,{glyph:"CaretDown",className:Et,fill:b(ve(ve({},Lt(Ye),!A),St(Ye),A))}))),e.createElement(x,wr),e.createElement(z,xr,e.createElement(An,{id:on,labelId:tn,refEl:an,ref:un,menuWidth:fr,searchLoadingMessage:ie,searchErrorMessage:te,searchEmptyMessage:ne},lr)))));function kr(e){cn&&cn.current&&(e===Re&&(cn.current.scrollLeft=cn.current.scrollWidth),e===Pe&&(cn.current.scrollTop=cn.current.scrollHeight))}}export{It as Combobox,wn as ComboboxGroup,yr as ComboboxOption};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|