@leafygreen-ui/select
Advanced tools
Comparing version 10.3.5-next.5 to 10.3.5-next.6
# @leafygreen-ui/select | ||
## 10.3.5-next.6 | ||
### Patch Changes | ||
- b060d06ce: Updates story files for Storybook 7.x | ||
- Updated dependencies [6a3f03fd2] | ||
- Updated dependencies [b060d06ce] | ||
- Updated dependencies [b060d06ce] | ||
- @leafygreen-ui/typography@16.4.1-next.6 | ||
- @leafygreen-ui/button@20.0.8-next.6 | ||
- @leafygreen-ui/hooks@7.7.4-next.6 | ||
- @leafygreen-ui/icon@11.16.1-next.6 | ||
- @leafygreen-ui/leafygreen-provider@3.1.3-next.6 | ||
- @leafygreen-ui/lib@10.3.4-next.6 | ||
- @leafygreen-ui/popover@11.0.10-next.6 | ||
## 10.3.5-next.5 | ||
@@ -4,0 +20,0 @@ |
@@ -22,4 +22,4 @@ import React from 'react'; | ||
declare type Props = MenuButtonProps & Required<LabelProp | Pick<JSX.IntrinsicElements['div'], 'aria-controls' | 'aria-expanded' | 'aria-describedby'>>; | ||
declare const MenuButton: React.ForwardRefExoticComponent<Pick<Props, "key" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "text" | "deselected" | "readOnly" | "onClose" | "onOpen" | "errorMessage" | "state" | "baseFontSize" | "__INTERNAL__menuButtonSlot__"> & React.RefAttributes<HTMLElement>>; | ||
declare const MenuButton: React.ForwardRefExoticComponent<Pick<Props, "aria-labelledby" | "aria-label" | "children" | "key" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "errorMessage" | "state" | "baseFontSize" | "readOnly" | "__INTERNAL__menuButtonSlot__" | "text" | "deselected" | "onClose" | "onOpen"> & React.RefAttributes<HTMLElement>>; | ||
export default MenuButton; | ||
//# sourceMappingURL=MenuButton.d.ts.map |
{ | ||
"name": "@leafygreen-ui/select", | ||
"version": "10.3.5-next.5", | ||
"version": "10.3.5-next.6", | ||
"description": "leafyGreen UI Kit Select", | ||
@@ -23,11 +23,11 @@ "main": "./dist/index.js", | ||
"dependencies": { | ||
"@leafygreen-ui/button": "^20.0.8-next.5", | ||
"@leafygreen-ui/button": "^20.0.8-next.6", | ||
"@leafygreen-ui/emotion": "^4.0.4", | ||
"@leafygreen-ui/hooks": "^7.7.4-next.5", | ||
"@leafygreen-ui/icon": "^11.16.1-next.5", | ||
"@leafygreen-ui/lib": "^10.3.4-next.5", | ||
"@leafygreen-ui/hooks": "^7.7.4-next.6", | ||
"@leafygreen-ui/icon": "^11.16.1-next.6", | ||
"@leafygreen-ui/lib": "^10.3.4-next.6", | ||
"@leafygreen-ui/palette": "^4.0.4", | ||
"@leafygreen-ui/popover": "^11.0.10-next.5", | ||
"@leafygreen-ui/popover": "^11.0.10-next.6", | ||
"@leafygreen-ui/tokens": "^2.1.0", | ||
"@leafygreen-ui/typography": "^16.4.1-next.5", | ||
"@leafygreen-ui/typography": "^16.4.1-next.6", | ||
"@types/react-is": "^17.0.0", | ||
@@ -39,3 +39,3 @@ "lodash": "^4.17.21", | ||
"peerDependencies": { | ||
"@leafygreen-ui/leafygreen-provider": "^3.1.3-next.5" | ||
"@leafygreen-ui/leafygreen-provider": "^3.1.3-next.6" | ||
}, | ||
@@ -42,0 +42,0 @@ "homepage": "https://github.com/mongodb/leafygreen-ui/tree/main/packages/select", |
@@ -1,1 +0,1 @@ | ||
import e,{createContext as n,useContext as r,useRef as t,useCallback as o,useEffect as a,useMemo as l,useState as i}from"react";import{css as s,cx as c}from"@leafygreen-ui/emotion";import d from"@leafygreen-ui/icon/dist/Beaker";import u from"lodash/isUndefined";import{usePrevious as p,useIdAllocator as f,useAvailableSpace as m,useEventListener as g,useViewportSize as h}from"@leafygreen-ui/hooks";import{Theme as b,createUniqueClassName as v,isComponentType as y,consoleOnce as x,keyMap as w}from"@leafygreen-ui/lib";import k,{Align as O,Justify as E}from"@leafygreen-ui/popover";import{transitionDuration as N,fontFamilies as S,fontWeights as C,breakpoints as j,spacing as D,typeScales as z,focusRing as P,hoverRing as I,BaseFontSize as _}from"@leafygreen-ui/tokens";import{transparentize as L}from"polished";import{palette as M}from"@leafygreen-ui/palette";import{isFragment as A}from"react-is";import T from"prop-types";import{isComponentGlyph as B}from"@leafygreen-ui/icon";import F from"@leafygreen-ui/icon/dist/Checkmark";import V,{Size as G,Variant as H}from"@leafygreen-ui/button";import R from"@leafygreen-ui/icon/dist/CaretDown";import W from"@leafygreen-ui/icon/dist/Warning";import{useDarkMode as Z}from"@leafygreen-ui/leafygreen-provider";import{Label as K,Description as U}from"@leafygreen-ui/typography";function X(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 q(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?X(Object(r),!0).forEach((function(n){Y(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):X(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))}))}return e}function Y(e,n,r){return(n=function(e){var n=function(e,n){if("object"!=typeof e||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var t=r.call(e,n||"default");if("object"!=typeof t)return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}(e,"string");return"symbol"==typeof n?n:String(n)}(n))in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function $(){return $=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},$.apply(this,arguments)}function J(e,n){if(null==e)return{};var r,t,o=function(e,n){if(null==e)return{};var r,t,o={},a=Object.keys(e);for(t=0;t<a.length;t++)r=a[t],n.indexOf(r)>=0||(o[r]=e[r]);return o}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(t=0;t<a.length;t++)r=a[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function Q(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function ee(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,a,l,i=[],s=!0,c=!1;try{if(a=(r=r.call(e)).next,0===n){if(Object(r)!==r)return;s=!1}else for(;!(s=(t=a.call(r)).done)&&(i.push(t.value),i.length!==n);s=!0);}catch(e){c=!0,o=e}finally{try{if(!s&&null!=r.return&&(l=r.return(),Object(l)!==l))return}finally{if(c)throw o}}return i}}(e,n)||re(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 ne(e){return function(e){if(Array.isArray(e))return te(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||re(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 re(e,n){if(e){if("string"==typeof e)return te(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)?te(e,n):void 0}}function te(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,ae,le,ie,se,ce,de,ue,pe,fe,me,ge,he,be,ve,ye,xe,we,ke={XSmall:"xsmall",Small:"small",Default:"default",Large:"large"},Oe={None:"none",Error:"error"},Ee={Trigger:"trigger",Option:"option"},Ne=n({theme:b.Light,size:ke.Default,open:!1,disabled:!1}),Se=(Y(oe={},b.Light,{menu:{border:M.gray.light2,shadow:L(.75,M.black)},option:{group:{label:M.gray.dark1},background:{base:M.white,hovered:M.gray.light2,focused:M.blue.light3},text:{base:M.gray.dark3,selected:M.blue.base,disabled:M.gray.base,focused:M.blue.dark2},icon:{base:M.gray.dark1,selected:M.blue.base,disabled:M.gray.base},indicator:{focused:M.blue.base}}}),Y(oe,b.Dark,{menu:{border:M.gray.base,shadow:L(.85,"#000000")},option:{group:{label:M.gray.base},background:{base:M.gray.dark3,hovered:M.gray.dark4,focused:M.blue.dark3},text:{base:M.gray.light2,selected:M.gray.light2,disabled:M.gray.dark2,focused:M.blue.light3},icon:{base:M.gray.base,selected:M.blue.light1,disabled:M.gray.dark1},indicator:{focused:M.blue.light1}}}),oe),Ce=(Y(ae={},ke.XSmall,{height:22,text:13,option:{text:13},warningIcon:16}),Y(ae,ke.Small,{height:28,text:13,option:{text:13},warningIcon:16}),Y(ae,ke.Default,{height:36,text:13,option:{text:13},warningIcon:16}),Y(ae,ke.Large,{height:48,text:18,option:{text:16},warningIcon:16}),ae),je=36,De=16,ze={text:16,lineHeight:19},Pe={text:16,lineHeight:22},Ie={text:16},_e=["children","className","glyph","selected","focused","disabled","onClick","onFocus","triggerScrollIntoView","hasGlyphs"],Le=v("option"),Me=s(le||(le=Q(["\n display: flex;\n width: 100%;\n outline: none;\n overflow-wrap: anywhere;\n transition: background-color ","ms ease-in-out;\n position: relative;\n padding: 8px 12px;\n\n &:before {\n content: '';\n position: absolute;\n transform: scaleY(0.3);\n top: 7px;\n bottom: 7px;\n left: 0;\n right: 0;\n width: 4px;\n border-radius: 0px 4px 4px 0px;\n opacity: 0;\n transition: all ","ms ease-in-out;\n }\n"])),N.default,N.default),Ae=s(ie||(ie=Q(["\n display: flex;\n align-items: center;\n font-family: ",";\n"])),S.default),Te=s(se||(se=Q(["\n min-width: 16px;\n margin-right: 6px;\n"]))),Be=s(ce||(ce=Q(["\n ."," {\n &:focus-visible & {\n color: currentColor;\n }\n }\n"])),Le);function Fe(n){var l,i=n.children,d=n.className,u=n.glyph,f=n.selected,m=n.focused,g=n.disabled,h=n.onClick,b=n.onFocus,v=n.triggerScrollIntoView,y=n.hasGlyphs,x=J(n,_e),w=r(Ne).theme,k=Se[w].option,O=t(null),E=o((function(){if(null==O.current)return null;var e=O.current,n=null==e?void 0:e.offsetParent;if(!n)return null;n.scrollTop=e.offsetTop+(e.clientHeight-n.clientHeight)/2}),[O]),N=p(v),S=v&&!N;a((function(){S&&E()}),[E,S]);var j=p(m),D=m&&!j;a((function(){D&&O.current.focus()}),[D]);var z=e.createElement("span",{className:c(Ae,Y({},s(de||(de=Q(["\n font-weight: ",";\n "])),C.bold),f))},i),P=e.createElement("span",{className:c(Te,s(ue||(ue=Q(["\n height: 100%;\n "]))))}),I=P;u&&(B(u)?I=e.cloneElement(u,{key:"glyph",className:c(Te,s(pe||(pe=Q(["\n color: ",";\n "])),k.icon.base),Be,Y({},s(fe||(fe=Q(["\n color: ",";\n "])),k.icon.disabled),g),u.props.className)}):console.error("`Option` instance did not render icon because it is not a known glyph element."));var _,L=f?e.createElement(F,{key:"checkmark",className:c(Te,s(me||(me=Q(["\n color: ",";\n "])),k.icon.selected),Be,Y({},s(ge||(ge=Q(["\n color: ",";\n "])),k.icon.disabled),g))}):P;return _=y?e.createElement("span",{className:s(he||(he=Q(["\n display: flex;\n justify-content: space-between;\n width: 100%;\n "])))},e.createElement("span",{className:s(be||(be=Q(["\n display: flex;\n "])))},I,z),L):e.createElement(e.Fragment,null,L,z),e.createElement("li",$({},x,{role:"option","aria-selected":f,tabIndex:-1,ref:O,className:c(Le,Me,s(ve||(ve=Q(["\n cursor: pointer;\n color: ",";\n "])),k.text.base),(l={},Y(l,s(ye||(ye=Q(["\n &:hover {\n background-color: ",";\n }\n "])),k.background.hovered),!g),Y(l,s(xe||(xe=Q(["\n &:focus-visible {\n color: ",";\n background-color: ",";\n\n &:before {\n opacity: 1;\n transform: scaleY(1);\n background-color: ",";\n }\n }\n "])),k.text.focused,k.background.focused,k.indicator.focused),!g),Y(l,s(we||(we=Q(["\n cursor: not-allowed;\n color: ",";\n "])),k.text.disabled),g),l),d),onClick:h,onFocus:b,onKeyDown:void 0}),_)}function Ve(e){throw Error("`Option` must be a child of a `Select` instance")}Fe.displayName="Option",Ve.displayName="Option",Ve.propTypes={children:T.node.isRequired,className:T.string,glyph:T.element,value:T.string,disabled:T.bool};var Ge,He,Re,We=["className","label","children"],Ze=s(Ge||(Ge=Q(["\n padding: 8px 0;\n"]))),Ke=s(He||(He=Q(["\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"])),C.bold);function Ue(n){var t=n.className,o=n.label,a=n.children,l=J(n,We),i=r(Ne).theme,d=Se[i].option,u=f({prefix:"select-option-group"});return e.createElement("div",$({className:c(Ze,t)},l),e.createElement("div",{id:u,className:c(Ke,s(Re||(Re=Q(["\n color: ",";\n "])),d.group.label))},o),e.createElement("div",{role:"group","aria-labelledby":u},a))}function Xe(e){throw Error("`OptionGroup` must be a child of a `Select` instance")}Ue.displayName="OptionGroup",Xe.displayName="OptionGroup",Xe.propTypes={children:T.oneOfType([T.element,T.arrayOf(T.oneOfType([T.oneOf([!1,null,void 0,""]),T.element]))]).isRequired,className:T.string,label:T.string.isRequired,disabled:T.bool};var qe=["children"],Ye="@media only screen and (max-width: ".concat(j.Tablet,"px) and (hover: none)"),$e="".concat(Ye," and (pointer: coarse), ").concat(Ye," and (pointer: none)");function Je(e){return null==e||!1===e||""===e}function Qe(n,r){e.Children.forEach(n,(function(e){y(e,"Option")?r(e):y(e,"OptionGroup")?Qe(e.props.children,(function(n){return r(n,e)})):A(e)&&Qe(e.props.children,r)}))}function en(n,r,t){return e.Children.toArray(n).every((function(e){return y(e,"Option")}))||e.Children.toArray(n).every((function(e){return y(e,"OptionGroup")}))||x.warn("LeafyGreen Select: Combining grouped and ungrouped Select Options can cause styling issues"),e.Children.map(n,(function(n){if(y(n,"Option"))return e.createElement(Fe,r(n));if(y(n,"OptionGroup")){var o=n.props,a=o.children,l=J(o,qe);return e.createElement(Ue,$({className:void 0},l),en(a,(function(e){return r(e,n)}),t))}return A(n)?en(n.props.children,r,t):(Je(n)||null==t||t(n),null)}))}function nn(e){return null===e?"":void 0!==e.props.value?e.props.value:Array.isArray(e.props.children)?e.props.children.filter((function(e){return!Je(e)})).join(""):e.props.children?e.props.children.toString():""}function rn(e,n){var r,t,o;return null!==(r=e.props.disabled)&&void 0!==r&&r||null!==(t=null==n||null===(o=n.props)||void 0===o?void 0:o.disabled)&&void 0!==t&&t}function tn(e,n,r){return nn(e)===r&&!rn(e,n)}function on(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=n.initialValue,o=n.deps,a=void 0===o?[]:o,i=t(r);return l((function(){return{get current(){return i.current},set current(n){i.current=n,e(n)}}}),[e,i].concat(ne(a)))}function an(e,n){var r=o((function(e,n){Array.isArray(e)?e.forEach(r):"function"==typeof e?e(n):e&&(e.current=n)}),[]);return on(o((function(n){return r(e,n)}),[e,r]),{initialValue:n})}var ln,sn,cn,dn,un=function(e){var n=ee(i(e),2),r=n[0];return on(n[1],{initialValue:e,deps:[r]})},pn=v("select-popover"),fn=s(ln||(ln=Q(["\n position: relative;\n text-align: left;\n width: 100%;\n border-radius: 3px;\n line-height: 16px;\n list-style: none;\n margin: 0;\n padding: 0;\n overflow: auto;\n"]))),mn=s(sn||(sn=Q(["\n width: max-content;\n"]))),gn=function(e,n){var r=Ce[n],t=Se[e];return c(s(cn||(cn=Q(["\n font-family: ",";\n font-size: ","px;\n min-height: ","px;\n background-color: ",";\n border-radius: 12px;\n box-shadow: 0 4px 7px 0 ",";\n padding: 8px 0;\n "])),S.default,r.option.text,r.height,t.option.background.base,t.menu.shadow))},hn=e.forwardRef((function(n,t){var a=n.children,l=n.id,i=n.referenceElement,d=n.className,p=n.labelId,f=n.dropdownWidthBasis,g=n.usePortal,h=void 0===g||g,b=n.portalContainer,v=n.scrollContainer,y=n.portalClassName,x=n.popoverZIndex,w=r(Ne),N=w.theme,S=w.size,C=w.disabled,j=w.open,D=an(t,null),z=m(i,8),P=u(z)?"unset":"".concat(Math.min(z,274),"px"),I=o((function(e){D.current&&D.current.focus(),e.stopPropagation()}),[D]),_=q({popoverZIndex:x},h?{usePortal:h,portalClassName:y,portalContainer:b,scrollContainer:v}:{usePortal:h});return e.createElement(k,$({active:j&&!C,spacing:6,align:O.Bottom,justify:E.Start,adjustOnMutation:!0,className:c(pn,d,Y({},mn,f===Ee.Option)),refEl:i},_),e.createElement("ul",{"aria-labelledby":p,role:"listbox",ref:D,tabIndex:-1,onClick:I,className:c(fn,gn(N,S),s(dn||(dn=Q(["\n max-height: ",";\n "," {\n font-size: ","px;\n }\n "])),P,$e,Ie.text)),id:l},a))}));hn.displayName="ListMenu";var bn,vn,yn,xn,wn,kn,On,En,Nn,Sn,Cn,jn,Dn,zn,Pn,In,_n,Ln,Mn,An,Tn,Bn,Fn,Vn,Gn,Hn,Rn,Wn,Zn,Kn=["children","value","text","name","deselected","readOnly","onClose","onOpen","errorMessage","state","baseFontSize","__INTERNAL__menuButtonSlot__"],Un=v("select-menu"),Xn=s(bn||(bn=Q(["\n // Override button defaults\n font-weight: ",";\n > *:last-child {\n grid-template-columns: 1fr 16px;\n justify-content: flex-start;\n\n > svg {\n justify-self: right;\n width: 16px;\n height: 16px;\n }\n }\n"])),C.regular),qn=(Y(kn={},ke.Default,s(vn||(vn=Q(["\n > *:last-child {\n padding: 0 12px;\n }\n "])))),Y(kn,ke.Large,s(yn||(yn=Q(["\n > *:last-child {\n padding: 0 12px 0 ","px;\n }\n "])),D[3])),Y(kn,ke.Small,s(xn||(xn=Q(["\n > *:last-child {\n padding: 0 ","px 0 10px;\n }\n "])),D[2])),Y(kn,ke.XSmall,s(wn||(wn=Q(["\n text-transform: none;\n font-size: ","px;\n line-height: ","px;\n > *:last-child {\n padding: 0 ","px 0 10px;\n }\n "])),z.body1.fontSize,z.body1.lineHeight,D[1])),kn),Yn=(Y(Nn={},b.Light,s(On||(On=Q(["\n background-color: ",";\n // Override button default color\n > *:last-child {\n > svg {\n color: ",";\n }\n }\n "])),M.white,M.gray.dark2)),Y(Nn,b.Dark,s(En||(En=Q(["\n border-color: ",";\n background-color: ",";\n color: ",";\n\n // Override button default color\n > *:last-child {\n > svg {\n color: ",";\n }\n }\n\n &:hover,\n &:active,\n &:focus {\n background-color: ",";\n color: ",";\n }\n "])),M.gray.base,M.gray.dark4,M.gray.light3,M.gray.light1,M.gray.dark4,M.gray.light3)),Nn),$n=(Y(jn={},b.Light,s(Sn||(Sn=Q(["\n &:focus-visible {\n box-shadow: ",";\n border-color: rgba(255, 255, 255, 0);\n }\n "])),P.light.input)),Y(jn,b.Dark,s(Cn||(Cn=Q(["\n &:focus-visible {\n background-color: ",";\n box-shadow: ",";\n border-color: rgba(255, 255, 255, 0);\n }\n "])),M.gray.dark4,P.dark.input)),jn),Jn=(Y(Pn={},b.Light,s(Dn||(Dn=Q(["\n color: ",";\n "])),M.gray.dark1)),Y(Pn,b.Dark,s(zn||(zn=Q(["\n color: ",";\n\n &:hover,\n &:active,\n &:focus {\n color: ",";\n }\n "])),M.gray.light1,M.gray.light1)),Pn),Qn=s(In||(In=Q(["\n &:disabled {\n cursor: not-allowed;\n pointer-events: unset;\n box-shadow: unset;\n\n &:active {\n pointer-events: none;\n }\n }\n"]))),er=(Y(Mn={},b.Light,c(Qn,s(_n||(_n=Q(["\n &:disabled {\n background-color: ",";\n color: ",";\n\n > *:last-child {\n > svg {\n color: ",";\n }\n }\n }\n "])),M.gray.light2,M.gray.base,M.gray.base))),Y(Mn,b.Dark,c(Qn,s(Ln||(Ln=Q(["\n &:disabled {\n background-color: ",";\n color: ",";\n border-color: ",";\n\n > *:last-child {\n > svg {\n color: ",";\n }\n }\n }\n "])),M.gray.dark3,M.gray.dark2,M.gray.dark2,M.gray.dark2))),Mn),nr=s(An||(An=Q(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-grow: 1;\n gap: ","px;\n overflow: hidden;\n"])),D[1]),rr=s(Tn||(Tn=Q(["\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n max-width: 100%;\n"]))),tr=(Y(Bn={},b.Light,M.red.base),Y(Bn,b.Dark,M.red.light1),Bn),or=(Y(Gn={},b.Light,s(Fn||(Fn=Q(["\n border-color: ",";\n background-color: ",";\n\n &:hover,\n &:active {\n box-shadow: ",";\n }\n "])),tr[b.Light],M.white,I.light.red)),Y(Gn,b.Dark,s(Vn||(Vn=Q(["\n border-color: ",";\n\n &:hover,\n &:active {\n border-color: ",";\n box-shadow: ",";\n }\n "])),tr[b.Dark],tr[b.Dark],I.dark.red)),Gn),ar=e.forwardRef((function(n,t){var a,l,i=n.children,d=n.value,u=n.text,p=n.name,f=n.deselected;n.readOnly;var m=n.onClose,g=n.onOpen,h=n.errorMessage,v=n.state,y=n.baseFontSize,x=n.__INTERNAL__menuButtonSlot__,w=J(n,Kn),k=r(Ne),O=k.theme,E=k.open,N=k.size,S=k.disabled,C=an(t,null),j=Ce[N],D=o((function(){E?m():g(),C.current.focus()}),[m,g,E,C]),z=x||V,P=x?"":c(Xn,Yn[O],qn[N],$n[O],(Y(a={},Jn[O],f),Y(a,er[O],S),Y(a,or[O],v===Oe.Error&&!!h),Y(a,s(Hn||(Hn=Q(["\n letter-spacing: initial;\n "]))),N===G.XSmall),a),s(Rn||(Rn=Q(["\n width: 100%;\n "," {\n height: ","px;\n font-size: ","px;\n }\n "])),$e,je,De)),I=null!==(l=w["data-testid"])&&void 0!==l?l:"leafygreen-ui-select-menubutton";return e.createElement(z,$({},w,{ref:C,name:p,value:d,disabled:S,onClick:D,variant:H.Default,darkMode:O===b.Dark,rightGlyph:e.createElement(R,null),size:N,"data-testid":I,className:c(P,Y({},s(Wn||(Wn=Q(["\n font-size: ","px;\n "])),y),N===G.Default))}),e.createElement("div",{className:nr},e.createElement("div",{className:c(Un,rr)},u),v===Oe.Error&&h&&e.createElement(W,{role:"presentation",className:s(Zn||(Zn=Q(["\n color: ",";\n "])),tr[O]),size:j.warningIcon})),i)}));ar.displayName="MenuButton";var lr,ir,sr,cr,dr,ur,pr,fr,mr,gr,hr,br,vr,yr,xr=["children","darkMode","size","disabled","allowDeselect","usePortal","placeholder","errorMessage","state","dropdownWidthBasis","baseFontSize","id","aria-labelledby","aria-label","className","label","description","name","defaultValue","value","onChange","readOnly","portalContainer","scrollContainer","portalClassName","popoverZIndex","__INTERNAL__menuButtonSlot__"],wr=s(lr||(lr=Q(["\n display: flex;\n flex-direction: column;\n margin-bottom: ","px;\n"])),D[1]),kr=s(ir||(ir=Q(["\n display: flex;\n flex-direction: column;\n"]))),Or=s(sr||(sr=Q(["\n font-size: ","px;\n line-height: ","px;\n"])),z.large.fontSize,z.large.lineHeight),Er=function(e){var n=e.darkMode,r=e.sizeSet;return s(cr||(cr=Q(["\n font-family: ",";\n color: ",";\n font-size: ","px;\n margin-top: ","px;\n padding-left: 2px;\n transition: color ","ms ease-in-out;\n transition-delay: ","ms;\n"])),S.default,n?M.red.light1:M.red.base,r.text,D[1],N.faster,N.faster)};function Nr(n){var r,t,d,u=n.children,p=n.darkMode,m=n.size,b=void 0===m?ke.Default:m,v=n.disabled,y=void 0!==v&&v,x=n.allowDeselect,k=void 0===x||x,O=n.usePortal,E=void 0===O||O,N=n.placeholder,S=void 0===N?"Select":N,C=n.errorMessage,j=void 0===C?"":C,D=n.state,z=void 0===D?Oe.None:D,P=n.dropdownWidthBasis,I=void 0===P?Ee.Trigger:P,L=n.baseFontSize,M=void 0===L?_.Body1:L,A=n.id,T=n["aria-labelledby"],B=n["aria-label"],F=n.className,V=n.label,G=n.description,H=n.name,R=n.defaultValue,W=n.value,X=n.onChange,ne=n.readOnly,re=n.portalContainer,te=n.scrollContainer,oe=n.portalClassName,ae=n.popoverZIndex,le=n.__INTERNAL__menuButtonSlot__,ie=J(n,xr),se=f({prefix:"select",id:A}),ce=l((function(){return B&&!V?void 0:null!=T?T:"".concat(se,"-label")}),[T,B,V,se]);V||T||B||console.error("For screen-reader accessibility, label, aria-label, or aria-labelledby must be provided to Select.");var de=Z(p),ue=de.darkMode,pe=de.theme,fe="".concat(se,"-description"),me="".concat(se,"-menu"),ge=ee(i(!1),2),he=ge[0],be=ge[1],ve=un(null),ye=f({prefix:"select"}),xe=un(null),we=Ce[b],Se=l((function(){return{theme:pe,size:b,open:he,disabled:y}}),[pe,b,he,y]);a((function(){void 0!==W&&void 0===X&&!0!==ne&&console.warn("You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.")}),[X,ne,W]);var je=o((function(){be(!0)}),[]),De=o((function(){be(!1),ve.current.focus()}),[ve]);a((function(){if(he){var e=function(e){var n=ve.current.contains(e.target)||xe.current.contains(e.target);be(n)};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}}),[xe,ve,he]);var Ie=l((function(){var e=null;return void 0===W&&void 0!==R&&Qe(u,(function(n,r){tn(n,r,R)&&(e=n)})),e}),[u,R,W]),_e=ee(i(Ie),2),Le=_e[0],Me=_e[1];a((function(){var e;null!==Le&&Me(null!==(e=function(e,n){var r,t,o,a,l,i,s,c;return Qe(e,(function(e){if(e===n)l=n;else if(e.props.children===n.props.children&&e.props.value===n.props.value){var r;null!==(r=i)&&void 0!==r||(i=e)}else if(void 0!==e.props.value&&e.props.value===n.props.value){var t;null!==(t=s)&&void 0!==t||(s=e)}else if(nn(e)===nn(n)){var o;null!==(o=c)&&void 0!==o||(c=e)}})),null!==(r=null!==(t=null!==(o=null!==(a=l)&&void 0!==a?a:i)&&void 0!==o?o:s)&&void 0!==t?t:c)&&void 0!==r?r:null}(u,Le))&&void 0!==e?e:Ie)}),[u,Ie,Le]);var Ae=l((function(){if(void 0!==W){var e=null;return Qe(u,(function(n,r){tn(n,r,W)&&(e=n)})),e}return Le}),[u,Le,W]),Te=o((function(e,n){void 0===W&&Me(e),null==X||X(nn(e),n),He(void 0),De()}),[X,De,W]),Be=o((function(e,n){return function(r){r.preventDefault(),r.stopPropagation(),y||n||(Te(e,r),De())}}),[y,De,Te]),Ve=ee(i(),2),Ge=Ve[0],He=Ve[1],Re=l((function(){var e=[];return k&&e.push(null),Qe(u,(function(n,r){rn(n,r)||e.push(n)})),e}),[u,k]),We=o((function(e){void 0!==Ge&&Te(Ge,e)}),[Ge,Te]),Ze=o((function(){He(Re[0])}),[Re]),Ke=o((function(){He(Re[Re.length-1])}),[Re]),Ue=o((function(){if(void 0===Ge||0===Re.indexOf(Ge))Ke();else{var e=Re.indexOf(Ge)-1;He(Re[e])}}),[Re,Ge,Ke]),Xe=o((function(){if(void 0===Ge||Re.indexOf(Ge)===Re.length-1)Ze();else{var e=Re.indexOf(Ge)+1;He(Re[e])}}),[Re,Ge,Ze]),qe=o((function(e,n){return function(r){r.preventDefault(),r.stopPropagation(),y||n||He(e)}}),[y]),Ye=o((function(e){var n,r;if(!(e.ctrlKey||e.shiftKey||e.altKey)){var t=null===(n=xe.current)||void 0===n?void 0:n.contains(document.activeElement),o=null===(r=ve.current)||void 0===r?void 0:r.contains(document.activeElement);if(o||t)switch(e.keyCode){case w.Tab:case w.Escape:De(),He(void 0);break;case w.Enter:case w.Space:he&&!o&&e.preventDefault(),We(e);break;case w.ArrowUp:!he&&o&&je(),e.preventDefault(),Ue();break;case w.ArrowDown:!he&&o&&je(),e.preventDefault(),Xe()}}}),[xe,ve,De,he,We,Ue,Xe,je]);g("keydown",Ye);var Je=h(),on=l((function(){var e=!1;return Qe(u,(function(n){e||(e=void 0!==n.props.glyph)})),e}),[u]),an=l((function(){return null!==Je&&null!==xe.current&&void 0===Ge&&he}),[Ge,xe,he,Je]),ln=l((function(){var n=null===Ae;return e.createElement(Fe,{className:void 0,glyph:void 0,selected:n,focused:null===Ge,disabled:!1,onClick:Be(null,!1),onFocus:qe(null,!1),hasGlyphs:!1,triggerScrollIntoView:n&&an},S)}),[an,Ge,Be,qe,S,Ae]),sn=l((function(){return en(u,(function(e,n){var r=e===Ae,t=rn(e,n);return q(q({},e.props),{},{className:e.props.className,glyph:e.props.glyph,selected:r,focused:e===Ge,disabled:t,children:e.props.children,hasGlyphs:on,onClick:Be(e,t),onFocus:qe(e,t),triggerScrollIntoView:r&&an})}),(function(){console.error("`Select` instance received child that is not `Option` or `OptionGroup`.")}))}),[an,u,Ge,Be,qe,on,Ae]),cn=q({popoverZIndex:ae},E?{usePortal:E,portalClassName:oe,portalContainer:re,scrollContainer:te}:{usePortal:E});return e.createElement("div",{className:c(kr,F)},(V||G)&&e.createElement("div",{className:wr},V&&e.createElement(K,{htmlFor:ye,id:ce,darkMode:ue,disabled:y,className:c((r={},Y(r,Or,b===ke.Large),Y(r,s(dr||(dr=Q(["\n font-size: ","px;\n line-height: 20px;\n "])),M),b===ke.Default),r),s(ur||(ur=Q(["\n // Prevent hover state from showing when hovering label\n pointer-events: none;\n "]))),s(pr||(pr=Q(["\n "," {\n font-size: ","px;\n line-height: ","px;\n }\n "])),$e,ze.text,ze.lineHeight))},V),G&&e.createElement(U,{id:fe,darkMode:ue,disabled:y,className:c((t={},Y(t,Or,b===ke.Large),Y(t,s(fr||(fr=Q(["\n font-size: ","px;\n line-height: 20px;\n "])),M),b===ke.Default),t),s(mr||(mr=Q(["\n "," {\n font-size: ","px;\n line-height: ","px;\n }\n "])),$e,Pe.text,Pe.lineHeight))},G)),e.createElement(Ne.Provider,{value:Se},e.createElement(ar,$({},ie,{id:ye,ref:ve,name:H,readOnly:ne,value:nn(Ae),text:null!==Ae?Ae.props.children:S,deselected:null===Ae,onOpen:je,onClose:De,"aria-labelledby":ce,"aria-label":V||T?void 0:B,"aria-controls":me,"aria-expanded":he,"aria-describedby":fe,"aria-invalid":z===Oe.Error,"aria-disabled":y,errorMessage:j,state:z,baseFontSize:M,__INTERNAL__menuButtonSlot__:le}),e.createElement(hn,$({labelId:ce,id:me,referenceElement:ve,ref:xe,className:c(Y({},s(gr||(gr=Q(["\n width: ","px;\n "])),null===(d=ve.current)||void 0===d?void 0:d.clientWidth),I===Ee.Trigger)),dropdownWidthBasis:I},cn),k&&ln,sn))),z===Oe.Error&&j&&e.createElement("span",{className:c(Er({darkMode:ue,sizeSet:we}),s(hr||(hr=Q(["\n "," {\n font-size: ","px;\n line-height: ","px;\n }\n "])),$e,Pe.text,Pe.lineHeight),Y({},s(br||(br=Q(["\n // Hide error text when menu is open,\n // so it doesn't peek around the menu corner\n color: transparent;\n "]))),he))},j))}Nr.displayName="Select",Nr.propTypes={label:T.string,"aria-labelledby":T.string,"aria-label":T.string,description:T.string,placeholder:T.string,className:T.string,darkMode:T.bool,size:T.oneOf(Object.values(ke)),disabled:T.bool,id:T.string,value:T.string,defaultValue:T.string,onChange:T.func,readOnly:T.bool,errorMessage:T.string,state:T.oneOf(Object.values(Oe)),allowDeselect:T.bool,baseFontSize:T.oneOf(Object.values(_)),dropdownWidthBasis:T.oneOf(Object.values(Ee))};var Sr=["className"],Cr=["className","defaultValue","readOnly"],jr={title:"Components/Select",component:Nr,parameters:{default:"Uncontrolled",controls:{exclude:["children"]}},args:{placeholder:"Select",disabled:!1,allowDeselect:!1,darkMode:!1,children:[e.createElement(Ve,{key:"long",value:"long"},"Cras mattis consectetur purus sit amet fermentum. Maecenas sed diam eget risus varius blandit sit amet non magna."),e.createElement(Xe,{key:"Common",label:"Common"},e.createElement(Ve,{value:"dog"},"Dog"),e.createElement(Ve,{value:"cat"},"Cat")),e.createElement(Xe,{key:"Less common",label:"Less common"},e.createElement(Ve,{value:"hamster"},"Hamster"),e.createElement(Ve,{value:"parrot"},"Parrot")),e.createElement(Ve,{key:"iguana",value:"iguana"},"Mexican spiny-tailed iguana"),e.createElement(Ve,{key:"spider",value:"spider",disabled:!0},"Spider")],usePortal:!0},argTypes:{placeholder:{control:"text"},disabled:{control:"boolean"},label:{control:"text"},description:{control:"text"},value:{control:"text"},defaultValue:{control:"text"},readOnly:{control:"boolean"},errorMessage:{control:"text"},allowDeselect:{control:"boolean"}}},Dr=function(n){var r=n.className,t=J(n,Sr);return e.createElement(Nr,$({},t,{"data-test":"hello-world",className:c(s(vr||(vr=Q(["\n min-width: 200px;\n max-width: 400px;\n "]))),r)}))},zr=function(n){var r=n.className;n.defaultValue,n.readOnly;var t=J(n,Cr),o=ee(i("cat"),2),a=o[0],l=o[1];return e.createElement(Nr,$({},t,{"data-test":"hello-world",className:c(s(yr||(yr=Q(["\n min-width: 200px;\n max-width: 400px;\n "]))),r),readOnly:!1,value:a,onChange:l}))},Pr=Dr.bind({});Pr.args={children:[e.createElement(Xe,{key:"Common",label:"Common"},e.createElement(Ve,{glyph:e.createElement(d,null),value:"dog"},"Dog"),e.createElement(Ve,{glyph:e.createElement(d,null),value:"cat"},"Cat")),e.createElement(Xe,{key:"Less common",label:"Less common"},e.createElement(Ve,{glyph:e.createElement(d,null),value:"hamster"},"Hamster"),e.createElement(Ve,{glyph:e.createElement(d,null),value:"parrot"},"Parrot")),e.createElement(Ve,{glyph:e.createElement(d,null),key:"iguana",value:"iguana"},"Mexican spiny-tailed iguana"),e.createElement(Ve,{glyph:e.createElement(d,null),key:"spider",value:"spider",disabled:!0},"Spider")]};export{zr as Controlled,Dr as Uncontrolled,Pr as WithIcons,jr as default}; | ||
import e,{createContext as n,useContext as r,useRef as t,useCallback as o,useEffect as a,useMemo as l,useState as i}from"react";import{css as s,cx as c}from"@leafygreen-ui/emotion";import d from"@leafygreen-ui/icon/dist/Beaker";import{Theme as u,createUniqueClassName as p,isComponentType as f,consoleOnce as m,keyMap as g,storybookExcludedControlParams as h}from"@leafygreen-ui/lib";import b from"lodash/isUndefined";import{usePrevious as v,useIdAllocator as y,useAvailableSpace as x,useEventListener as w,useViewportSize as k}from"@leafygreen-ui/hooks";import O,{Align as E,Justify as N}from"@leafygreen-ui/popover";import{transitionDuration as S,fontFamilies as C,fontWeights as j,breakpoints as D,spacing as z,typeScales as P,focusRing as I,hoverRing as _,BaseFontSize as L}from"@leafygreen-ui/tokens";import{transparentize as M}from"polished";import{palette as A}from"@leafygreen-ui/palette";import{isFragment as T}from"react-is";import B from"prop-types";import{isComponentGlyph as F}from"@leafygreen-ui/icon";import V from"@leafygreen-ui/icon/dist/Checkmark";import G,{Size as H,Variant as R}from"@leafygreen-ui/button";import W from"@leafygreen-ui/icon/dist/CaretDown";import Z from"@leafygreen-ui/icon/dist/Warning";import{useDarkMode as K}from"@leafygreen-ui/leafygreen-provider";import{Label as U,Description as X}from"@leafygreen-ui/typography";function q(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 Y(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?q(Object(r),!0).forEach((function(n){$(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):q(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))}))}return e}function $(e,n,r){return(n=function(e){var n=function(e,n){if("object"!=typeof e||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var t=r.call(e,n||"default");if("object"!=typeof t)return t;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}(e,"string");return"symbol"==typeof n?n:String(n)}(n))in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function J(){return J=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},J.apply(this,arguments)}function Q(e,n){if(null==e)return{};var r,t,o=function(e,n){if(null==e)return{};var r,t,o={},a=Object.keys(e);for(t=0;t<a.length;t++)r=a[t],n.indexOf(r)>=0||(o[r]=e[r]);return o}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(t=0;t<a.length;t++)r=a[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function ee(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function ne(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,a,l,i=[],s=!0,c=!1;try{if(a=(r=r.call(e)).next,0===n){if(Object(r)!==r)return;s=!1}else for(;!(s=(t=a.call(r)).done)&&(i.push(t.value),i.length!==n);s=!0);}catch(e){c=!0,o=e}finally{try{if(!s&&null!=r.return&&(l=r.return(),Object(l)!==l))return}finally{if(c)throw o}}return i}}(e,n)||te(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 re(e){return function(e){if(Array.isArray(e))return oe(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||te(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 te(e,n){if(e){if("string"==typeof e)return oe(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)?oe(e,n):void 0}}function oe(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 ae,le,ie,se,ce,de,ue,pe,fe,me,ge,he,be,ve,ye,xe,we,ke,Oe={XSmall:"xsmall",Small:"small",Default:"default",Large:"large"},Ee={None:"none",Error:"error"},Ne={Trigger:"trigger",Option:"option"},Se=n({theme:u.Light,size:Oe.Default,open:!1,disabled:!1}),Ce=($(ae={},u.Light,{menu:{border:A.gray.light2,shadow:M(.75,A.black)},option:{group:{label:A.gray.dark1},background:{base:A.white,hovered:A.gray.light2,focused:A.blue.light3},text:{base:A.gray.dark3,selected:A.blue.base,disabled:A.gray.base,focused:A.blue.dark2},icon:{base:A.gray.dark1,selected:A.blue.base,disabled:A.gray.base},indicator:{focused:A.blue.base}}}),$(ae,u.Dark,{menu:{border:A.gray.base,shadow:M(.85,"#000000")},option:{group:{label:A.gray.base},background:{base:A.gray.dark3,hovered:A.gray.dark4,focused:A.blue.dark3},text:{base:A.gray.light2,selected:A.gray.light2,disabled:A.gray.dark2,focused:A.blue.light3},icon:{base:A.gray.base,selected:A.blue.light1,disabled:A.gray.dark1},indicator:{focused:A.blue.light1}}}),ae),je=($(le={},Oe.XSmall,{height:22,text:13,option:{text:13},warningIcon:16}),$(le,Oe.Small,{height:28,text:13,option:{text:13},warningIcon:16}),$(le,Oe.Default,{height:36,text:13,option:{text:13},warningIcon:16}),$(le,Oe.Large,{height:48,text:18,option:{text:16},warningIcon:16}),le),De=36,ze=16,Pe={text:16,lineHeight:19},Ie={text:16,lineHeight:22},_e={text:16},Le=["children","className","glyph","selected","focused","disabled","onClick","onFocus","triggerScrollIntoView","hasGlyphs"],Me=p("option"),Ae=s(ie||(ie=ee(["\n display: flex;\n width: 100%;\n outline: none;\n overflow-wrap: anywhere;\n transition: background-color ","ms ease-in-out;\n position: relative;\n padding: 8px 12px;\n\n &:before {\n content: '';\n position: absolute;\n transform: scaleY(0.3);\n top: 7px;\n bottom: 7px;\n left: 0;\n right: 0;\n width: 4px;\n border-radius: 0px 4px 4px 0px;\n opacity: 0;\n transition: all ","ms ease-in-out;\n }\n"])),S.default,S.default),Te=s(se||(se=ee(["\n display: flex;\n align-items: center;\n font-family: ",";\n"])),C.default),Be=s(ce||(ce=ee(["\n min-width: 16px;\n margin-right: 6px;\n"]))),Fe=s(de||(de=ee(["\n ."," {\n &:focus-visible & {\n color: currentColor;\n }\n }\n"])),Me);function Ve(n){var l,i=n.children,d=n.className,u=n.glyph,p=n.selected,f=n.focused,m=n.disabled,g=n.onClick,h=n.onFocus,b=n.triggerScrollIntoView,y=n.hasGlyphs,x=Q(n,Le),w=r(Se).theme,k=Ce[w].option,O=t(null),E=o((function(){if(null==O.current)return null;var e=O.current,n=null==e?void 0:e.offsetParent;if(!n)return null;n.scrollTop=e.offsetTop+(e.clientHeight-n.clientHeight)/2}),[O]),N=v(b),S=b&&!N;a((function(){S&&E()}),[E,S]);var C=v(f),D=f&&!C;a((function(){D&&O.current.focus()}),[D]);var z=e.createElement("span",{className:c(Te,$({},s(ue||(ue=ee(["\n font-weight: ",";\n "])),j.bold),p))},i),P=e.createElement("span",{className:c(Be,s(pe||(pe=ee(["\n height: 100%;\n "]))))}),I=P;u&&(F(u)?I=e.cloneElement(u,{key:"glyph",className:c(Be,s(fe||(fe=ee(["\n color: ",";\n "])),k.icon.base),Fe,$({},s(me||(me=ee(["\n color: ",";\n "])),k.icon.disabled),m),u.props.className)}):console.error("`Option` instance did not render icon because it is not a known glyph element."));var _,L=p?e.createElement(V,{key:"checkmark",className:c(Be,s(ge||(ge=ee(["\n color: ",";\n "])),k.icon.selected),Fe,$({},s(he||(he=ee(["\n color: ",";\n "])),k.icon.disabled),m))}):P;return _=y?e.createElement("span",{className:s(be||(be=ee(["\n display: flex;\n justify-content: space-between;\n width: 100%;\n "])))},e.createElement("span",{className:s(ve||(ve=ee(["\n display: flex;\n "])))},I,z),L):e.createElement(e.Fragment,null,L,z),e.createElement("li",J({},x,{role:"option","aria-selected":p,tabIndex:-1,ref:O,className:c(Me,Ae,s(ye||(ye=ee(["\n cursor: pointer;\n color: ",";\n "])),k.text.base),(l={},$(l,s(xe||(xe=ee(["\n &:hover {\n background-color: ",";\n }\n "])),k.background.hovered),!m),$(l,s(we||(we=ee(["\n &:focus-visible {\n color: ",";\n background-color: ",";\n\n &:before {\n opacity: 1;\n transform: scaleY(1);\n background-color: ",";\n }\n }\n "])),k.text.focused,k.background.focused,k.indicator.focused),!m),$(l,s(ke||(ke=ee(["\n cursor: not-allowed;\n color: ",";\n "])),k.text.disabled),m),l),d),onClick:g,onFocus:h,onKeyDown:void 0}),_)}function Ge(e){throw Error("`Option` must be a child of a `Select` instance")}Ve.displayName="Option",Ge.displayName="Option",Ge.propTypes={children:B.node.isRequired,className:B.string,glyph:B.element,value:B.string,disabled:B.bool};var He,Re,We,Ze=["className","label","children"],Ke=s(He||(He=ee(["\n padding: 8px 0;\n"]))),Ue=s(Re||(Re=ee(["\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"])),j.bold);function Xe(n){var t=n.className,o=n.label,a=n.children,l=Q(n,Ze),i=r(Se).theme,d=Ce[i].option,u=y({prefix:"select-option-group"});return e.createElement("div",J({className:c(Ke,t)},l),e.createElement("div",{id:u,className:c(Ue,s(We||(We=ee(["\n color: ",";\n "])),d.group.label))},o),e.createElement("div",{role:"group","aria-labelledby":u},a))}function qe(e){throw Error("`OptionGroup` must be a child of a `Select` instance")}Xe.displayName="OptionGroup",qe.displayName="OptionGroup",qe.propTypes={children:B.oneOfType([B.element,B.arrayOf(B.oneOfType([B.oneOf([!1,null,void 0,""]),B.element]))]).isRequired,className:B.string,label:B.string.isRequired,disabled:B.bool};var Ye=["children"],$e="@media only screen and (max-width: ".concat(D.Tablet,"px) and (hover: none)"),Je="".concat($e," and (pointer: coarse), ").concat($e," and (pointer: none)");function Qe(e){return null==e||!1===e||""===e}function en(n,r){e.Children.forEach(n,(function(e){f(e,"Option")?r(e):f(e,"OptionGroup")?en(e.props.children,(function(n){return r(n,e)})):T(e)&&en(e.props.children,r)}))}function nn(n,r,t){return e.Children.toArray(n).every((function(e){return f(e,"Option")}))||e.Children.toArray(n).every((function(e){return f(e,"OptionGroup")}))||m.warn("LeafyGreen Select: Combining grouped and ungrouped Select Options can cause styling issues"),e.Children.map(n,(function(n){if(f(n,"Option"))return e.createElement(Ve,r(n));if(f(n,"OptionGroup")){var o=n.props,a=o.children,l=Q(o,Ye);return e.createElement(Xe,J({className:void 0},l),nn(a,(function(e){return r(e,n)}),t))}return T(n)?nn(n.props.children,r,t):(Qe(n)||null==t||t(n),null)}))}function rn(e){return null===e?"":void 0!==e.props.value?e.props.value:Array.isArray(e.props.children)?e.props.children.filter((function(e){return!Qe(e)})).join(""):e.props.children?e.props.children.toString():""}function tn(e,n){var r,t,o;return null!==(r=e.props.disabled)&&void 0!==r&&r||null!==(t=null==n||null===(o=n.props)||void 0===o?void 0:o.disabled)&&void 0!==t&&t}function on(e,n,r){return rn(e)===r&&!tn(e,n)}function an(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=n.initialValue,o=n.deps,a=void 0===o?[]:o,i=t(r);return l((function(){return{get current(){return i.current},set current(n){i.current=n,e(n)}}}),[e,i].concat(re(a)))}function ln(e,n){var r=o((function(e,n){Array.isArray(e)?e.forEach(r):"function"==typeof e?e(n):e&&(e.current=n)}),[]);return an(o((function(n){return r(e,n)}),[e,r]),{initialValue:n})}var sn,cn,dn,un,pn=function(e){var n=ne(i(e),2),r=n[0];return an(n[1],{initialValue:e,deps:[r]})},fn=p("select-popover"),mn=s(sn||(sn=ee(["\n position: relative;\n text-align: left;\n width: 100%;\n border-radius: 3px;\n line-height: 16px;\n list-style: none;\n margin: 0;\n padding: 0;\n overflow: auto;\n"]))),gn=s(cn||(cn=ee(["\n width: max-content;\n"]))),hn=function(e,n){var r=je[n],t=Ce[e];return c(s(dn||(dn=ee(["\n font-family: ",";\n font-size: ","px;\n min-height: ","px;\n background-color: ",";\n border-radius: 12px;\n box-shadow: 0 4px 7px 0 ",";\n padding: 8px 0;\n "])),C.default,r.option.text,r.height,t.option.background.base,t.menu.shadow))},bn=e.forwardRef((function(n,t){var a=n.children,l=n.id,i=n.referenceElement,d=n.className,u=n.labelId,p=n.dropdownWidthBasis,f=n.usePortal,m=void 0===f||f,g=n.portalContainer,h=n.scrollContainer,v=n.portalClassName,y=n.popoverZIndex,w=r(Se),k=w.theme,S=w.size,C=w.disabled,j=w.open,D=ln(t,null),z=x(i,8),P=b(z)?"unset":"".concat(Math.min(z,274),"px"),I=o((function(e){D.current&&D.current.focus(),e.stopPropagation()}),[D]),_=Y({popoverZIndex:y},m?{usePortal:m,portalClassName:v,portalContainer:g,scrollContainer:h}:{usePortal:m});return e.createElement(O,J({active:j&&!C,spacing:6,align:E.Bottom,justify:N.Start,adjustOnMutation:!0,className:c(fn,d,$({},gn,p===Ne.Option)),refEl:i},_),e.createElement("ul",{"aria-labelledby":u,role:"listbox",ref:D,tabIndex:-1,onClick:I,className:c(mn,hn(k,S),s(un||(un=ee(["\n max-height: ",";\n "," {\n font-size: ","px;\n }\n "])),P,Je,_e.text)),id:l},a))}));bn.displayName="ListMenu";var vn,yn,xn,wn,kn,On,En,Nn,Sn,Cn,jn,Dn,zn,Pn,In,_n,Ln,Mn,An,Tn,Bn,Fn,Vn,Gn,Hn,Rn,Wn,Zn,Kn,Un=["children","value","text","name","deselected","readOnly","onClose","onOpen","errorMessage","state","baseFontSize","__INTERNAL__menuButtonSlot__"],Xn=p("select-menu"),qn=s(vn||(vn=ee(["\n // Override button defaults\n font-weight: ",";\n > *:last-child {\n grid-template-columns: 1fr 16px;\n justify-content: flex-start;\n\n > svg {\n justify-self: right;\n width: 16px;\n height: 16px;\n }\n }\n"])),j.regular),Yn=($(On={},Oe.Default,s(yn||(yn=ee(["\n > *:last-child {\n padding: 0 12px;\n }\n "])))),$(On,Oe.Large,s(xn||(xn=ee(["\n > *:last-child {\n padding: 0 12px 0 ","px;\n }\n "])),z[3])),$(On,Oe.Small,s(wn||(wn=ee(["\n > *:last-child {\n padding: 0 ","px 0 10px;\n }\n "])),z[2])),$(On,Oe.XSmall,s(kn||(kn=ee(["\n text-transform: none;\n font-size: ","px;\n line-height: ","px;\n > *:last-child {\n padding: 0 ","px 0 10px;\n }\n "])),P.body1.fontSize,P.body1.lineHeight,z[1])),On),$n=($(Sn={},u.Light,s(En||(En=ee(["\n background-color: ",";\n // Override button default color\n > *:last-child {\n > svg {\n color: ",";\n }\n }\n "])),A.white,A.gray.dark2)),$(Sn,u.Dark,s(Nn||(Nn=ee(["\n border-color: ",";\n background-color: ",";\n color: ",";\n\n // Override button default color\n > *:last-child {\n > svg {\n color: ",";\n }\n }\n\n &:hover,\n &:active,\n &:focus {\n background-color: ",";\n color: ",";\n }\n "])),A.gray.base,A.gray.dark4,A.gray.light3,A.gray.light1,A.gray.dark4,A.gray.light3)),Sn),Jn=($(Dn={},u.Light,s(Cn||(Cn=ee(["\n &:focus-visible {\n box-shadow: ",";\n border-color: rgba(255, 255, 255, 0);\n }\n "])),I.light.input)),$(Dn,u.Dark,s(jn||(jn=ee(["\n &:focus-visible {\n background-color: ",";\n box-shadow: ",";\n border-color: rgba(255, 255, 255, 0);\n }\n "])),A.gray.dark4,I.dark.input)),Dn),Qn=($(In={},u.Light,s(zn||(zn=ee(["\n color: ",";\n "])),A.gray.dark1)),$(In,u.Dark,s(Pn||(Pn=ee(["\n color: ",";\n\n &:hover,\n &:active,\n &:focus {\n color: ",";\n }\n "])),A.gray.light1,A.gray.light1)),In),er=s(_n||(_n=ee(["\n &:disabled {\n cursor: not-allowed;\n pointer-events: unset;\n box-shadow: unset;\n\n &:active {\n pointer-events: none;\n }\n }\n"]))),nr=($(An={},u.Light,c(er,s(Ln||(Ln=ee(["\n &:disabled {\n background-color: ",";\n color: ",";\n\n > *:last-child {\n > svg {\n color: ",";\n }\n }\n }\n "])),A.gray.light2,A.gray.base,A.gray.base))),$(An,u.Dark,c(er,s(Mn||(Mn=ee(["\n &:disabled {\n background-color: ",";\n color: ",";\n border-color: ",";\n\n > *:last-child {\n > svg {\n color: ",";\n }\n }\n }\n "])),A.gray.dark3,A.gray.dark2,A.gray.dark2,A.gray.dark2))),An),rr=s(Tn||(Tn=ee(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-grow: 1;\n gap: ","px;\n overflow: hidden;\n"])),z[1]),tr=s(Bn||(Bn=ee(["\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n max-width: 100%;\n"]))),or=($(Fn={},u.Light,A.red.base),$(Fn,u.Dark,A.red.light1),Fn),ar=($(Hn={},u.Light,s(Vn||(Vn=ee(["\n border-color: ",";\n background-color: ",";\n\n &:hover,\n &:active {\n box-shadow: ",";\n }\n "])),or[u.Light],A.white,_.light.red)),$(Hn,u.Dark,s(Gn||(Gn=ee(["\n border-color: ",";\n\n &:hover,\n &:active {\n border-color: ",";\n box-shadow: ",";\n }\n "])),or[u.Dark],or[u.Dark],_.dark.red)),Hn),lr=e.forwardRef((function(n,t){var a,l,i=n.children,d=n.value,p=n.text,f=n.name,m=n.deselected;n.readOnly;var g=n.onClose,h=n.onOpen,b=n.errorMessage,v=n.state,y=n.baseFontSize,x=n.__INTERNAL__menuButtonSlot__,w=Q(n,Un),k=r(Se),O=k.theme,E=k.open,N=k.size,S=k.disabled,C=ln(t,null),j=je[N],D=o((function(){E?g():h(),C.current.focus()}),[g,h,E,C]),z=x||G,P=x?"":c(qn,$n[O],Yn[N],Jn[O],($(a={},Qn[O],m),$(a,nr[O],S),$(a,ar[O],v===Ee.Error&&!!b),$(a,s(Rn||(Rn=ee(["\n letter-spacing: initial;\n "]))),N===H.XSmall),a),s(Wn||(Wn=ee(["\n width: 100%;\n "," {\n height: ","px;\n font-size: ","px;\n }\n "])),Je,De,ze)),I=null!==(l=w["data-testid"])&&void 0!==l?l:"leafygreen-ui-select-menubutton";return e.createElement(z,J({},w,{ref:C,name:f,value:d,disabled:S,onClick:D,variant:R.Default,darkMode:O===u.Dark,rightGlyph:e.createElement(W,null),size:N,"data-testid":I,className:c(P,$({},s(Zn||(Zn=ee(["\n font-size: ","px;\n "])),y),N===H.Default))}),e.createElement("div",{className:rr},e.createElement("div",{className:c(Xn,tr)},p),v===Ee.Error&&b&&e.createElement(Z,{role:"presentation",className:s(Kn||(Kn=ee(["\n color: ",";\n "])),or[O]),size:j.warningIcon})),i)}));lr.displayName="MenuButton";var ir,sr,cr,dr,ur,pr,fr,mr,gr,hr,br,vr,yr,xr,wr=["children","darkMode","size","disabled","allowDeselect","usePortal","placeholder","errorMessage","state","dropdownWidthBasis","baseFontSize","id","aria-labelledby","aria-label","className","label","description","name","defaultValue","value","onChange","readOnly","portalContainer","scrollContainer","portalClassName","popoverZIndex","__INTERNAL__menuButtonSlot__"],kr=s(ir||(ir=ee(["\n display: flex;\n flex-direction: column;\n margin-bottom: ","px;\n"])),z[1]),Or=s(sr||(sr=ee(["\n display: flex;\n flex-direction: column;\n"]))),Er=s(cr||(cr=ee(["\n font-size: ","px;\n line-height: ","px;\n"])),P.large.fontSize,P.large.lineHeight),Nr=function(e){var n=e.darkMode,r=e.sizeSet;return s(dr||(dr=ee(["\n font-family: ",";\n color: ",";\n font-size: ","px;\n margin-top: ","px;\n padding-left: 2px;\n transition: color ","ms ease-in-out;\n transition-delay: ","ms;\n"])),C.default,n?A.red.light1:A.red.base,r.text,z[1],S.faster,S.faster)};function Sr(n){var r,t,d,u=n.children,p=n.darkMode,f=n.size,m=void 0===f?Oe.Default:f,h=n.disabled,b=void 0!==h&&h,v=n.allowDeselect,x=void 0===v||v,O=n.usePortal,E=void 0===O||O,N=n.placeholder,S=void 0===N?"Select":N,C=n.errorMessage,j=void 0===C?"":C,D=n.state,z=void 0===D?Ee.None:D,P=n.dropdownWidthBasis,I=void 0===P?Ne.Trigger:P,_=n.baseFontSize,M=void 0===_?L.Body1:_,A=n.id,T=n["aria-labelledby"],B=n["aria-label"],F=n.className,V=n.label,G=n.description,H=n.name,R=n.defaultValue,W=n.value,Z=n.onChange,q=n.readOnly,re=n.portalContainer,te=n.scrollContainer,oe=n.portalClassName,ae=n.popoverZIndex,le=n.__INTERNAL__menuButtonSlot__,ie=Q(n,wr),se=y({prefix:"select",id:A}),ce=l((function(){return B&&!V?void 0:null!=T?T:"".concat(se,"-label")}),[T,B,V,se]);V||T||B||console.error("For screen-reader accessibility, label, aria-label, or aria-labelledby must be provided to Select.");var de=K(p),ue=de.darkMode,pe=de.theme,fe="".concat(se,"-description"),me="".concat(se,"-menu"),ge=ne(i(!1),2),he=ge[0],be=ge[1],ve=pn(null),ye=y({prefix:"select"}),xe=pn(null),we=je[m],ke=l((function(){return{theme:pe,size:m,open:he,disabled:b}}),[pe,m,he,b]);a((function(){void 0!==W&&void 0===Z&&!0!==q&&console.warn("You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.")}),[Z,q,W]);var Ce=o((function(){be(!0)}),[]),De=o((function(){be(!1),ve.current.focus()}),[ve]);a((function(){if(he){var e=function(e){var n=ve.current.contains(e.target)||xe.current.contains(e.target);be(n)};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}}),[xe,ve,he]);var ze=l((function(){var e=null;return void 0===W&&void 0!==R&&en(u,(function(n,r){on(n,r,R)&&(e=n)})),e}),[u,R,W]),_e=ne(i(ze),2),Le=_e[0],Me=_e[1];a((function(){var e;null!==Le&&Me(null!==(e=function(e,n){var r,t,o,a,l,i,s,c;return en(e,(function(e){if(e===n)l=n;else if(e.props.children===n.props.children&&e.props.value===n.props.value){var r;null!==(r=i)&&void 0!==r||(i=e)}else if(void 0!==e.props.value&&e.props.value===n.props.value){var t;null!==(t=s)&&void 0!==t||(s=e)}else if(rn(e)===rn(n)){var o;null!==(o=c)&&void 0!==o||(c=e)}})),null!==(r=null!==(t=null!==(o=null!==(a=l)&&void 0!==a?a:i)&&void 0!==o?o:s)&&void 0!==t?t:c)&&void 0!==r?r:null}(u,Le))&&void 0!==e?e:ze)}),[u,ze,Le]);var Ae=l((function(){if(void 0!==W){var e=null;return en(u,(function(n,r){on(n,r,W)&&(e=n)})),e}return Le}),[u,Le,W]),Te=o((function(e,n){void 0===W&&Me(e),null==Z||Z(rn(e),n),He(void 0),De()}),[Z,De,W]),Be=o((function(e,n){return function(r){r.preventDefault(),r.stopPropagation(),b||n||(Te(e,r),De())}}),[b,De,Te]),Fe=ne(i(),2),Ge=Fe[0],He=Fe[1],Re=l((function(){var e=[];return x&&e.push(null),en(u,(function(n,r){tn(n,r)||e.push(n)})),e}),[u,x]),We=o((function(e){void 0!==Ge&&Te(Ge,e)}),[Ge,Te]),Ze=o((function(){He(Re[0])}),[Re]),Ke=o((function(){He(Re[Re.length-1])}),[Re]),Ue=o((function(){if(void 0===Ge||0===Re.indexOf(Ge))Ke();else{var e=Re.indexOf(Ge)-1;He(Re[e])}}),[Re,Ge,Ke]),Xe=o((function(){if(void 0===Ge||Re.indexOf(Ge)===Re.length-1)Ze();else{var e=Re.indexOf(Ge)+1;He(Re[e])}}),[Re,Ge,Ze]),qe=o((function(e,n){return function(r){r.preventDefault(),r.stopPropagation(),b||n||He(e)}}),[b]),Ye=o((function(e){var n,r;if(!(e.ctrlKey||e.shiftKey||e.altKey)){var t=null===(n=xe.current)||void 0===n?void 0:n.contains(document.activeElement),o=null===(r=ve.current)||void 0===r?void 0:r.contains(document.activeElement);if(o||t)switch(e.keyCode){case g.Tab:case g.Escape:De(),He(void 0);break;case g.Enter:case g.Space:he&&!o&&e.preventDefault(),We(e);break;case g.ArrowUp:!he&&o&&Ce(),e.preventDefault(),Ue();break;case g.ArrowDown:!he&&o&&Ce(),e.preventDefault(),Xe()}}}),[xe,ve,De,he,We,Ue,Xe,Ce]);w("keydown",Ye);var $e=k(),Qe=l((function(){var e=!1;return en(u,(function(n){e||(e=void 0!==n.props.glyph)})),e}),[u]),an=l((function(){return null!==$e&&null!==xe.current&&void 0===Ge&&he}),[Ge,xe,he,$e]),ln=l((function(){var n=null===Ae;return e.createElement(Ve,{className:void 0,glyph:void 0,selected:n,focused:null===Ge,disabled:!1,onClick:Be(null,!1),onFocus:qe(null,!1),hasGlyphs:!1,triggerScrollIntoView:n&&an},S)}),[an,Ge,Be,qe,S,Ae]),sn=l((function(){return nn(u,(function(e,n){var r=e===Ae,t=tn(e,n);return Y(Y({},e.props),{},{className:e.props.className,glyph:e.props.glyph,selected:r,focused:e===Ge,disabled:t,children:e.props.children,hasGlyphs:Qe,onClick:Be(e,t),onFocus:qe(e,t),triggerScrollIntoView:r&&an})}),(function(){console.error("`Select` instance received child that is not `Option` or `OptionGroup`.")}))}),[an,u,Ge,Be,qe,Qe,Ae]),cn=Y({popoverZIndex:ae},E?{usePortal:E,portalClassName:oe,portalContainer:re,scrollContainer:te}:{usePortal:E});return e.createElement("div",{className:c(Or,F)},(V||G)&&e.createElement("div",{className:kr},V&&e.createElement(U,{htmlFor:ye,id:ce,darkMode:ue,disabled:b,className:c((r={},$(r,Er,m===Oe.Large),$(r,s(ur||(ur=ee(["\n font-size: ","px;\n line-height: 20px;\n "])),M),m===Oe.Default),r),s(pr||(pr=ee(["\n // Prevent hover state from showing when hovering label\n pointer-events: none;\n "]))),s(fr||(fr=ee(["\n "," {\n font-size: ","px;\n line-height: ","px;\n }\n "])),Je,Pe.text,Pe.lineHeight))},V),G&&e.createElement(X,{id:fe,darkMode:ue,disabled:b,className:c((t={},$(t,Er,m===Oe.Large),$(t,s(mr||(mr=ee(["\n font-size: ","px;\n line-height: 20px;\n "])),M),m===Oe.Default),t),s(gr||(gr=ee(["\n "," {\n font-size: ","px;\n line-height: ","px;\n }\n "])),Je,Ie.text,Ie.lineHeight))},G)),e.createElement(Se.Provider,{value:ke},e.createElement(lr,J({},ie,{id:ye,ref:ve,name:H,readOnly:q,value:rn(Ae),text:null!==Ae?Ae.props.children:S,deselected:null===Ae,onOpen:Ce,onClose:De,"aria-labelledby":ce,"aria-label":V||T?void 0:B,"aria-controls":me,"aria-expanded":he,"aria-describedby":fe,"aria-invalid":z===Ee.Error,"aria-disabled":b,errorMessage:j,state:z,baseFontSize:M,__INTERNAL__menuButtonSlot__:le}),e.createElement(bn,J({labelId:ce,id:me,referenceElement:ve,ref:xe,className:c($({},s(hr||(hr=ee(["\n width: ","px;\n "])),null===(d=ve.current)||void 0===d?void 0:d.clientWidth),I===Ne.Trigger)),dropdownWidthBasis:I},cn),x&&ln,sn))),z===Ee.Error&&j&&e.createElement("span",{className:c(Nr({darkMode:ue,sizeSet:we}),s(br||(br=ee(["\n "," {\n font-size: ","px;\n line-height: ","px;\n }\n "])),Je,Ie.text,Ie.lineHeight),$({},s(vr||(vr=ee(["\n // Hide error text when menu is open,\n // so it doesn't peek around the menu corner\n color: transparent;\n "]))),he))},j))}Sr.displayName="Select",Sr.propTypes={label:B.string,"aria-labelledby":B.string,"aria-label":B.string,description:B.string,placeholder:B.string,className:B.string,darkMode:B.bool,size:B.oneOf(Object.values(Oe)),disabled:B.bool,id:B.string,value:B.string,defaultValue:B.string,onChange:B.func,readOnly:B.bool,errorMessage:B.string,state:B.oneOf(Object.values(Ee)),allowDeselect:B.bool,baseFontSize:B.oneOf(Object.values(L)),dropdownWidthBasis:B.oneOf(Object.values(Ne))};var Cr=["className"],jr=["className","defaultValue","readOnly"],Dr={title:"Components/Select",component:Sr,parameters:{default:"Uncontrolled",controls:{exclude:[].concat(re(h),["children","value"])}},args:{placeholder:"Select",disabled:!1,allowDeselect:!1,darkMode:!1,children:[e.createElement(Ge,{key:"long",value:"long"},"Cras mattis consectetur purus sit amet fermentum. Maecenas sed diam eget risus varius blandit sit amet non magna."),e.createElement(qe,{key:"Common",label:"Common"},e.createElement(Ge,{value:"dog"},"Dog"),e.createElement(Ge,{value:"cat"},"Cat")),e.createElement(qe,{key:"Less common",label:"Less common"},e.createElement(Ge,{value:"hamster"},"Hamster"),e.createElement(Ge,{value:"parrot"},"Parrot")),e.createElement(Ge,{key:"iguana",value:"iguana"},"Mexican spiny-tailed iguana"),e.createElement(Ge,{key:"spider",value:"spider",disabled:!0},"Spider")],usePortal:!0},argTypes:{placeholder:{control:"text"},disabled:{control:"boolean"},label:{control:"text"},description:{control:"text"},defaultValue:{control:"text"},readOnly:{control:"boolean"},errorMessage:{control:"text"},allowDeselect:{control:"boolean"}}},zr=function(n){var r=n.className,t=Q(n,Cr);return e.createElement(Sr,J({},t,{"data-test":"hello-world",className:c(s(yr||(yr=ee(["\n min-width: 200px;\n max-width: 400px;\n "]))),r)}))},Pr=function(n){var r=n.className;n.defaultValue,n.readOnly;var t=Q(n,jr),o=ne(i("cat"),2),a=o[0],l=o[1];return e.createElement(Sr,J({},t,{"data-test":"hello-world",className:c(s(xr||(xr=ee(["\n min-width: 200px;\n max-width: 400px;\n "]))),r),readOnly:!1,value:a,onChange:l}))},Ir=zr.bind({});Ir.args={children:[e.createElement(qe,{key:"Common",label:"Common"},e.createElement(Ge,{glyph:e.createElement(d,null),value:"dog"},"Dog"),e.createElement(Ge,{glyph:e.createElement(d,null),value:"cat"},"Cat")),e.createElement(qe,{key:"Less common",label:"Less common"},e.createElement(Ge,{glyph:e.createElement(d,null),value:"hamster"},"Hamster"),e.createElement(Ge,{glyph:e.createElement(d,null),value:"parrot"},"Parrot")),e.createElement(Ge,{glyph:e.createElement(d,null),key:"iguana",value:"iguana"},"Mexican spiny-tailed iguana"),e.createElement(Ge,{glyph:e.createElement(d,null),key:"spider",value:"spider",disabled:!0},"Spider")]};export{Pr as Controlled,zr as Uncontrolled,Ir as WithIcons,Dr as default}; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
528724
4315