@mongodb-js/compass-components 1.4.0 → 1.6.0

package/lib/components/combobox/ComboboxGroup.js

@@ -0,0 +1,84 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InternalComboboxGroup = void 0;
+const react_1 = __importStar(require("react"));
+const prop_types_1 = __importDefault(require("prop-types"));
+const emotion_1 = require("@leafygreen-ui/emotion");
+const hooks_1 = require("@leafygreen-ui/hooks");
+const lib_1 = require("@leafygreen-ui/lib");
+const palette_1 = require("@leafygreen-ui/palette");
+const ComboboxContext_1 = require("./ComboboxContext");
+const comboboxGroupStyle = {
+    [lib_1.Theme.Light]: (0, emotion_1.css) `
+    padding-top: 8px;
+  `,
+    [lib_1.Theme.Dark]: (0, emotion_1.css) `
+    padding-top: 8px;
+  `,
+};
+const comboboxGroupLabel = (0, emotion_1.css) `
+  cursor: default;
+  width: 100%;
+  padding: 0 12px 2px;
+  outline: none;
+  overflow-wrap: anywhere;
+  font-size: 12px;
+  line-height: 16px;
+  font-weight: bold;
+  text-transform: uppercase;
+  letter-spacing: 0.4px;
+`;
+const comboboxGroupLabelThemeStyle = {
+    [lib_1.Theme.Light]: (0, emotion_1.css) `
+    color: ${palette_1.palette.gray.dark1};
+  `,
+    [lib_1.Theme.Dark]: (0, emotion_1.css) `
+    color: ${palette_1.palette.gray.light1};
+  `,
+};
+function InternalComboboxGroup({ label, className, children, }) {
+    const { theme } = (0, react_1.useContext)(ComboboxContext_1.ComboboxContext);
+    const groupId = (0, hooks_1.useIdAllocator)({ prefix: 'combobox-group' });
+    const childCount = react_1.default.Children.count(children);
+    return childCount > 0 ? (react_1.default.createElement("div", { className: (0, emotion_1.cx)(comboboxGroupStyle[theme], className) },
+        react_1.default.createElement("div", { className: (0, emotion_1.cx)(comboboxGroupLabel, comboboxGroupLabelThemeStyle[theme]), id: groupId }, label),
+        react_1.default.createElement("div", { role: "group", "aria-labelledby": groupId }, children))) : (react_1.default.createElement(react_1.default.Fragment, null));
+}
+exports.InternalComboboxGroup = InternalComboboxGroup;
+ComboboxGroup.displayName = 'ComboboxGroup';
+ComboboxGroup.propTypes = {
+    className: prop_types_1.default.string,
+    children: prop_types_1.default.node.isRequired,
+    label: prop_types_1.default.string.isRequired,
+};
+function ComboboxGroup(_) {
+    throw Error('`ComboboxGroup` must be a child of a `Combobox` instance');
+}
+exports.default = ComboboxGroup;
+//# sourceMappingURL=ComboboxGroup.js.map

package/lib/components/combobox/ComboboxGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboboxGroup.js","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,4DAAmC;AAEnC,oDAAiD;AACjD,gDAAsD;AACtD,4CAA2C;AAC3C,oDAAiD;AAGjD,uDAAoD;AAEpD,MAAM,kBAAkB,GAA0B;IAChD,CAAC,WAAK,CAAC,KAAK,CAAC,EAAE,IAAA,aAAG,EAAA;;GAEjB;IACD,CAAC,WAAK,CAAC,IAAI,CAAC,EAAE,IAAA,aAAG,EAAA;;GAEhB;CACF,CAAC;AAEF,MAAM,kBAAkB,GAAG,IAAA,aAAG,EAAA;;;;;;;;;;;CAW7B,CAAC;AAEF,MAAM,4BAA4B,GAA0B;IAC1D,CAAC,WAAK,CAAC,KAAK,CAAC,EAAE,IAAA,aAAG,EAAA;aACP,iBAAO,CAAC,IAAI,CAAC,KAAK;GAC5B;IACD,CAAC,WAAK,CAAC,IAAI,CAAC,EAAE,IAAA,aAAG,EAAA;aACN,iBAAO,CAAC,IAAI,CAAC,MAAM;GAC7B;CACF,CAAC;AAEF,SAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,QAAQ,GACW;IACnB,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,kBAAU,EAAC,iCAAe,CAAC,CAAC;IAE9C,MAAM,OAAO,GAAG,IAAA,sBAAc,EAAC,EAAE,MAAM,EAAE,gBAAgB,EAAE,CAAC,CAAC;IAC7D,MAAM,UAAU,GAAG,eAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAElD,OAAO,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,CACtB,uCAAK,SAAS,EAAE,IAAA,YAAE,EAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;QACtD,uCACE,SAAS,EAAE,IAAA,YAAE,EAAC,kBAAkB,EAAE,4BAA4B,CAAC,KAAK,CAAC,CAAC,EACtE,EAAE,EAAE,OAAO,IAEV,KAAK,CACF;QACN,uCAAK,IAAI,EAAC,OAAO,qBAAkB,OAAO,IACvC,QAAQ,CACL,CACF,CACP,CAAC,CAAC,CAAC,CACF,6DAAK,CACN,CAAC;AACJ,CAAC;AAzBD,sDAyBC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC;AAE5C,aAAa,CAAC,SAAS,GAAG;IACxB,SAAS,EAAE,oBAAS,CAAC,MAAM;IAC3B,QAAQ,EAAE,oBAAS,CAAC,IAAI,CAAC,UAAU;IACnC,KAAK,EAAE,oBAAS,CAAC,MAAM,CAAC,UAAU;CACnC,CAAC;AAEF,SAAwB,aAAa,CAAC,CAAqB;IACzD,MAAM,KAAK,CAAC,0DAA0D,CAAC,CAAC;AAC1E,CAAC;AAFD,gCAEC"}

package/lib/components/combobox/ComboboxMenu/ComboboxMenu.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { ComboboxProps } from '../Combobox.types';
+export declare const ComboboxMenu: React.ForwardRefExoticComponent<{
+    children?: React.ReactNode;
+    refEl: React.RefObject<HTMLDivElement>;
+    id: string;
+    labelId: string;
+} & Pick<ComboboxProps<any>, "portalContainer" | "scrollContainer" | "className" | "usePortal" | "portalClassName" | "popoverZIndex" | "searchEmptyMessage" | "searchErrorMessage" | "searchLoadingMessage"> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=ComboboxMenu.d.ts.map

package/lib/components/combobox/ComboboxMenu/ComboboxMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboboxMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/combobox/ComboboxMenu/ComboboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AASnD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAiClD,eAAO,MAAM,YAAY;eAjBZ,MAAM,SAAS;WACnB,MAAM,SAAS,CAAC,cAAc,CAAC;QAClC,MAAM;aACD,MAAM;mPAoIhB,CAAC"}

package/lib/components/combobox/ComboboxMenu/ComboboxMenu.js

@@ -0,0 +1,86 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ComboboxMenu = void 0;
+const react_1 = __importStar(require("react"));
+const isUndefined_1 = __importDefault(require("lodash/isUndefined"));
+const emotion_1 = require("@leafygreen-ui/emotion");
+const hooks_1 = require("@leafygreen-ui/hooks");
+const icon_1 = __importDefault(require("@leafygreen-ui/icon"));
+const palette_1 = require("@leafygreen-ui/palette");
+const popover_1 = __importDefault(require("@leafygreen-ui/popover"));
+const ComboboxContext_1 = require("../ComboboxContext");
+const Menu_styles_1 = require("./Menu.styles");
+exports.ComboboxMenu = react_1.default.forwardRef(({ children, id, refEl, labelId, searchLoadingMessage, searchErrorMessage, searchEmptyMessage, className, ...popoverProps }, forwardedRef) => {
+    const { disabled, darkMode, theme, size, isOpen, searchState } = (0, react_1.useContext)(ComboboxContext_1.ComboboxContext);
+    const ref = (0, hooks_1.useForwardedRef)(forwardedRef, null);
+    const availableSpace = (0, hooks_1.useAvailableSpace)(refEl);
+    const maxHeightValue = !(0, isUndefined_1.default)(availableSpace)
+        ? `${Math.min(availableSpace, 256)}px`
+        : 'unset';
+    const renderedMenuContents = (0, react_1.useMemo)(() => {
+        const messageStyles = (0, emotion_1.cx)(Menu_styles_1.menuMessageBaseStyle, Menu_styles_1.menuMessageThemeStyle[theme], Menu_styles_1.menuMessageSizeStyle[size]);
+        switch (searchState) {
+            case 'loading': {
+                return (react_1.default.createElement("span", { className: messageStyles },
+                    react_1.default.createElement(icon_1.default, { glyph: "Refresh", color: darkMode ? palette_1.palette.blue.light1 : palette_1.palette.blue.base, className: Menu_styles_1.loadingIconStyle }),
+                    searchLoadingMessage));
+            }
+            case 'error': {
+                return (react_1.default.createElement("span", { className: messageStyles },
+                    react_1.default.createElement(icon_1.default, { glyph: "Warning", color: darkMode ? palette_1.palette.red.light1 : palette_1.palette.red.base }),
+                    searchErrorMessage));
+            }
+            case 'unset':
+            default: {
+                if (children &&
+                    typeof children === 'object' &&
+                    'length' in children &&
+                    children.length > 0) {
+                    return react_1.default.createElement("ul", { className: Menu_styles_1.menuList }, children);
+                }
+                return react_1.default.createElement("span", { className: messageStyles }, searchEmptyMessage);
+            }
+        }
+    }, [
+        theme,
+        size,
+        searchState,
+        darkMode,
+        searchLoadingMessage,
+        searchErrorMessage,
+        children,
+        searchEmptyMessage,
+    ]);
+    return (react_1.default.createElement(popover_1.default, { active: isOpen && !disabled, spacing: 4, align: "bottom", justify: "middle", refEl: refEl, adjustOnMutation: true, className: (0, emotion_1.cx)(className, Menu_styles_1.popoverStyle, Menu_styles_1.popoverThemeStyle[theme]), ...popoverProps },
+        react_1.default.createElement("div", { ref: ref, id: id, role: "listbox", "aria-labelledby": labelId, "aria-expanded": isOpen, className: (0, emotion_1.cx)(Menu_styles_1.menuBaseStyle, Menu_styles_1.menuThemeStyle[theme], (0, emotion_1.css) `
+              max-height: ${maxHeightValue};
+            `), onMouseDownCapture: (e) => e.preventDefault() }, renderedMenuContents)));
+});
+exports.ComboboxMenu.displayName = 'ComboboxMenu';
+//# sourceMappingURL=ComboboxMenu.js.map

package/lib/components/combobox/ComboboxMenu/ComboboxMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboboxMenu.js","sourceRoot":"","sources":["../../../../src/components/combobox/ComboboxMenu/ComboboxMenu.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAmD;AACnD,qEAA6C;AAE7C,oDAAiD;AACjD,gDAA0E;AAC1E,+DAAuC;AACvC,oDAAiD;AACjD,qEAA6C;AAG7C,wDAAqD;AAErD,+CAUuB;AAoBV,QAAA,YAAY,GAAG,eAAK,CAAC,UAAU,CAC1C,CACE,EACE,QAAQ,EACR,EAAE,EACF,KAAK,EACL,OAAO,EACP,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,EAClB,SAAS,EACT,GAAG,YAAY,EACG,EACpB,YAAY,EACZ,EAAE;IACF,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,WAAW,EAAE,GAC5D,IAAA,kBAAU,EAAC,iCAAe,CAAC,CAAC;IAC9B,MAAM,GAAG,GAAG,IAAA,uBAAe,EAAC,YAAY,EAAE,IAAI,CAAC,CAAC;IAGhD,MAAM,cAAc,GAAG,IAAA,yBAAiB,EAAC,KAAK,CAAC,CAAC;IAChD,MAAM,cAAc,GAAG,CAAC,IAAA,qBAAW,EAAC,cAAc,CAAC;QACjD,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,cAAc,EAAE,GAAG,CAAC,IAAI;QACtC,CAAC,CAAC,OAAO,CAAC;IAMZ,MAAM,oBAAoB,GAAG,IAAA,eAAO,EAAC,GAAgB,EAAE;QACrD,MAAM,aAAa,GAAG,IAAA,YAAE,EACtB,kCAAoB,EACpB,mCAAqB,CAAC,KAAK,CAAC,EAC5B,kCAAoB,CAAC,IAAI,CAAC,CAC3B,CAAC;QAEF,QAAQ,WAAW,EAAE;YACnB,KAAK,SAAS,CAAC,CAAC;gBACd,OAAO,CACL,wCAAM,SAAS,EAAE,aAAa;oBAC5B,8BAAC,cAAI,IACH,KAAK,EAAC,SAAS,EACf,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,iBAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,iBAAO,CAAC,IAAI,CAAC,IAAI,EACzD,SAAS,EAAE,8BAAgB,GAC3B;oBACD,oBAAoB,CAChB,CACR,CAAC;aACH;YAED,KAAK,OAAO,CAAC,CAAC;gBACZ,OAAO,CACL,wCAAM,SAAS,EAAE,aAAa;oBAC5B,8BAAC,cAAI,IACH,KAAK,EAAC,SAAS,EACf,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,iBAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,iBAAO,CAAC,GAAG,CAAC,IAAI,GACvD;oBACD,kBAAkB,CACd,CACR,CAAC;aACH;YAED,KAAK,OAAO,CAAC;YACb,OAAO,CAAC,CAAC;gBACP,IACE,QAAQ;oBACR,OAAO,QAAQ,KAAK,QAAQ;oBAC5B,QAAQ,IAAI,QAAQ;oBACpB,QAAQ,CAAC,MAAM,GAAG,CAAC,EACnB;oBACA,OAAO,sCAAI,SAAS,EAAE,sBAAQ,IAAG,QAAQ,CAAM,CAAC;iBACjD;gBAED,OAAO,wCAAM,SAAS,EAAE,aAAa,IAAG,kBAAkB,CAAQ,CAAC;aACpE;SACF;IACH,CAAC,EAAE;QACD,KAAK;QACL,IAAI;QACJ,WAAW;QACX,QAAQ;QACR,oBAAoB;QACpB,kBAAkB;QAClB,QAAQ;QACR,kBAAkB;KACnB,CAAC,CAAC;IAEH,OAAO,CACL,8BAAC,iBAAO,IACN,MAAM,EAAE,MAAM,IAAI,CAAC,QAAQ,EAC3B,OAAO,EAAE,CAAC,EACV,KAAK,EAAC,QAAQ,EACd,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,KAAK,EACZ,gBAAgB,EAAE,IAAI,EACtB,SAAS,EAAE,IAAA,YAAE,EAAC,SAAS,EAAE,0BAAY,EAAE,+BAAiB,CAAC,KAAK,CAAC,CAAC,KAC5D,YAAY;QAEhB,uCACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,SAAS,qBACG,OAAO,mBACT,MAAM,EACrB,SAAS,EAAE,IAAA,YAAE,EACX,2BAAa,EACb,4BAAc,CAAC,KAAK,CAAC,EACrB,IAAA,aAAG,EAAA;4BACa,cAAc;aAC7B,CACF,EACD,kBAAkB,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,IAE5C,oBAAoB,CACjB,CACE,CACX,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC"}

package/lib/components/combobox/ComboboxMenu/Menu.styles.d.ts

@@ -0,0 +1,22 @@
+import { Theme } from '@leafygreen-ui/lib';
+import { ComboboxSize as Size } from '../Combobox.types';
+export declare const menuItemPadding: Record<Size, {
+    x: number;
+    y: number;
+}>;
+export declare const menuItemHeight: {
+    default: number;
+    large: number;
+};
+export declare const popoverStyle: string;
+export declare const popoverThemeStyle: Record<Theme, string>;
+export declare const menuBaseStyle: string;
+export declare const menuThemeStyle: Record<Theme, string>;
+export declare const menuSizeStyle: Record<Size, string>;
+export declare const menuList: string;
+export declare const menuMessageBaseStyle: string;
+export declare const menuMessageThemeStyle: Record<Theme, string>;
+export declare const menuMessageSizeStyle: Record<Size, string>;
+export declare const menuMessageIconSizeStyle: Record<Size, string>;
+export declare const loadingIconStyle: string;
+//# sourceMappingURL=Menu.styles.d.ts.map

package/lib/components/combobox/ComboboxMenu/Menu.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/combobox/ComboboxMenu/Menu.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAI3C,OAAO,EAAE,YAAY,IAAI,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEzD,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,IAAI,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAGlE,CAAC;AAGF,eAAO,MAAM,cAAc;;;CAI1B,CAAC;AAMF,eAAO,MAAM,YAAY,QAIxB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,CASnD,CAAC;AAEF,eAAO,MAAM,aAAa,QASzB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,CAShD,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAO9C,CAAC;AAEF,eAAO,MAAM,QAAQ,QAIpB,CAAC;AAEF,eAAO,MAAM,oBAAoB,QAKhC,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,CAOvD,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAarD,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CASzD,CAAC;AAWF,eAAO,MAAM,gBAAgB,QAE5B,CAAC"}

package/lib/components/combobox/ComboboxMenu/Menu.styles.js

@@ -0,0 +1,115 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.loadingIconStyle = exports.menuMessageIconSizeStyle = exports.menuMessageSizeStyle = exports.menuMessageThemeStyle = exports.menuMessageBaseStyle = exports.menuList = exports.menuSizeStyle = exports.menuThemeStyle = exports.menuBaseStyle = exports.popoverThemeStyle = exports.popoverStyle = exports.menuItemHeight = exports.menuItemPadding = void 0;
+const polished_1 = require("polished");
+const emotion_1 = require("@leafygreen-ui/emotion");
+const lib_1 = require("@leafygreen-ui/lib");
+const palette_1 = require("@leafygreen-ui/palette");
+const tokens_1 = require("@leafygreen-ui/tokens");
+const Combobox_types_1 = require("../Combobox.types");
+exports.menuItemPadding = {
+    [Combobox_types_1.ComboboxSize.Default]: { x: 12, y: 8 },
+    [Combobox_types_1.ComboboxSize.Large]: { x: 12, y: 8 },
+};
+exports.menuItemHeight = {
+    [Combobox_types_1.ComboboxSize.Default]: tokens_1.typeScales.body1.lineHeight + 2 * exports.menuItemPadding[Combobox_types_1.ComboboxSize.Default].y,
+    [Combobox_types_1.ComboboxSize.Large]: tokens_1.typeScales.body2.lineHeight + 2 * exports.menuItemPadding[Combobox_types_1.ComboboxSize.Large].y,
+};
+exports.popoverStyle = (0, emotion_1.css) `
+  overflow: hidden;
+  border-radius: 12px;
+  border: 1px solid;
+`;
+exports.popoverThemeStyle = {
+    [lib_1.Theme.Light]: (0, emotion_1.css) `
+    box-shadow: 0px 4px 7px ${(0, polished_1.transparentize)(0.85, palette_1.palette.black)};
+    border-color: ${palette_1.palette.gray.light2};
+  `,
+    [lib_1.Theme.Dark]: (0, emotion_1.css) `
+    box-shadow: 0px 4px 7px ${(0, polished_1.transparentize)(0.85, palette_1.palette.black)};
+    border-color: ${palette_1.palette.gray.dark3};
+  `,
+};
+exports.menuBaseStyle = (0, emotion_1.css) `
+  position: relative;
+  width: 100%;
+  margin: 0;
+  padding: ${tokens_1.spacing[2]}px 0;
+  font-family: ${tokens_1.fontFamilies.default};
+  border-radius: inherit;
+  overflow-y: auto;
+  scroll-behavior: smooth;
+`;
+exports.menuThemeStyle = {
+    [lib_1.Theme.Light]: (0, emotion_1.css) `
+    color: ${palette_1.palette.black};
+    background-color: ${palette_1.palette.white};
+  `,
+    [lib_1.Theme.Dark]: (0, emotion_1.css) `
+    color: ${palette_1.palette.gray.light1};
+    background-color: ${palette_1.palette.gray.dark3};
+  `,
+};
+exports.menuSizeStyle = {
+    [Combobox_types_1.ComboboxSize.Default]: (0, emotion_1.css) `
+    min-height: ${exports.menuItemHeight[Combobox_types_1.ComboboxSize.Default]}px;
+  `,
+    [Combobox_types_1.ComboboxSize.Large]: (0, emotion_1.css) `
+    min-height: ${exports.menuItemHeight[Combobox_types_1.ComboboxSize.Large]}px;
+  `,
+};
+exports.menuList = (0, emotion_1.css) `
+  position: relative;
+  margin: 0;
+  padding: 0;
+`;
+exports.menuMessageBaseStyle = (0, emotion_1.css) `
+  font-family: inherit;
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+`;
+exports.menuMessageThemeStyle = {
+    [lib_1.Theme.Light]: (0, emotion_1.css) `
+    color: ${palette_1.palette.gray.dark3};
+  `,
+    [lib_1.Theme.Dark]: (0, emotion_1.css) `
+    color: ${palette_1.palette.gray.light3};
+  `,
+};
+exports.menuMessageSizeStyle = {
+    [Combobox_types_1.ComboboxSize.Default]: (0, emotion_1.css) `
+    font-size: ${tokens_1.typeScales.body1.fontSize}px;
+    line-height: ${tokens_1.typeScales.body1.lineHeight}px;
+    padding: ${exports.menuItemPadding[Combobox_types_1.ComboboxSize.Default].y}px
+      ${exports.menuItemPadding[Combobox_types_1.ComboboxSize.Default].x}px;
+  `,
+    [Combobox_types_1.ComboboxSize.Large]: (0, emotion_1.css) `
+    font-size: ${tokens_1.typeScales.body2.fontSize}px;
+    line-height: ${tokens_1.typeScales.body2.lineHeight}px;
+    padding: ${exports.menuItemPadding[Combobox_types_1.ComboboxSize.Large].y}px
+      ${exports.menuItemPadding[Combobox_types_1.ComboboxSize.Large].x}px;
+  `,
+};
+exports.menuMessageIconSizeStyle = {
+    [Combobox_types_1.ComboboxSize.Default]: (0, emotion_1.css) `
+    height: ${tokens_1.typeScales.body1.fontSize}px;
+    width: ${tokens_1.typeScales.body1.fontSize}px;
+  `,
+    [Combobox_types_1.ComboboxSize.Large]: (0, emotion_1.css) `
+    height: ${tokens_1.typeScales.body2.fontSize}px;
+    width: ${tokens_1.typeScales.body2.fontSize}px;
+  `,
+};
+const loadingIconAnimation = (0, emotion_1.keyframes) `
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+`;
+exports.loadingIconStyle = (0, emotion_1.css) `
+  animation: ${loadingIconAnimation} 1.5s linear infinite;
+`;
+//# sourceMappingURL=Menu.styles.js.map

package/lib/components/combobox/ComboboxMenu/Menu.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.styles.js","sourceRoot":"","sources":["../../../../src/components/combobox/ComboboxMenu/Menu.styles.ts"],"names":[],"mappings":"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"}

package/lib/components/combobox/ComboboxOption.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { ComboboxOptionProps, InternalComboboxOptionProps } from './Combobox.types';
+declare const InternalComboboxOption: React.ForwardRefExoticComponent<InternalComboboxOptionProps & React.RefAttributes<HTMLLIElement>>;
+export { InternalComboboxOption };
+export declare function ComboboxOption(_: ComboboxOptionProps): JSX.Element;
+export declare namespace ComboboxOption {
+    var displayName: string;
+    var propTypes: {
+        displayName: PropTypes.Requireable<string>;
+        value: PropTypes.Requireable<string>;
+        glyph: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        disabled: PropTypes.Requireable<boolean>;
+        className: PropTypes.Requireable<string>;
+    };
+}
+//# sourceMappingURL=ComboboxOption.d.ts.map

package/lib/components/combobox/ComboboxOption.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboboxOption.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAChE,OAAO,SAAS,MAAM,YAAY,CAAC;AAWnC,OAAO,EACL,mBAAmB,EAEnB,2BAA2B,EAC5B,MAAM,kBAAkB,CAAC;AAqK1B,QAAA,MAAM,sBAAsB,mGAwJ3B,CAAC;AAGF,OAAO,EAAE,sBAAsB,EAAE,CAAC;AAClC,wBAAgB,cAAc,CAAC,CAAC,EAAE,mBAAmB,GAAG,GAAG,CAAC,OAAO,CAElE;yBAFe,cAAc"}

package/lib/components/combobox/ComboboxOption.js

@@ -0,0 +1,258 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ComboboxOption = exports.InternalComboboxOption = void 0;
+const react_1 = __importStar(require("react"));
+const prop_types_1 = __importDefault(require("prop-types"));
+const checkbox_1 = __importDefault(require("@leafygreen-ui/checkbox"));
+const emotion_1 = require("@leafygreen-ui/emotion");
+const hooks_1 = require("@leafygreen-ui/hooks");
+const icon_1 = __importStar(require("@leafygreen-ui/icon"));
+const lib_1 = require("@leafygreen-ui/lib");
+const palette_1 = require("@leafygreen-ui/palette");
+const tokens_1 = require("@leafygreen-ui/tokens");
+const Menu_styles_1 = require("./ComboboxMenu/Menu.styles");
+const Combobox_types_1 = require("./Combobox.types");
+const ComboboxContext_1 = require("./ComboboxContext");
+const utils_1 = require("./utils");
+const comboboxOptionBaseStyle = (0, emotion_1.css) `
+  position: relative;
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: flex-start;
+  list-style: none;
+  color: inherit;
+  cursor: pointer;
+  overflow: hidden;
+  font-family: ${tokens_1.fontFamilies.default};
+
+  // Left wedge
+  &:before {
+    content: '';
+    position: absolute;
+    left: 0;
+    width: 4px;
+    height: calc(100% - 14px);
+    background-color: rgba(255, 255, 255, 0);
+    border-radius: 0 6px 6px 0;
+    transform: scale3d(0, 0.3, 0);
+    transition: 200ms ease-in-out;
+    transition-property: transform, background-color;
+  }
+`;
+const optionNameStyles = (width) => (0, emotion_1.css) `
+  max-width: ${width}px;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-shrink: 0;
+  margin-right: ${tokens_1.spacing[2]}px;
+`;
+const comboboxOptionThemeStyle = {
+    [lib_1.Theme.Light]: (0, emotion_1.css) `
+    &:hover {
+      outline: none;
+      background-color: ${palette_1.palette.gray.light2};
+    }
+  `,
+    [lib_1.Theme.Dark]: (0, emotion_1.css) `
+    &:hover {
+      outline: none;
+      background-color: ${palette_1.palette.gray.dark4};
+    }
+  `,
+};
+const comboboxOptionSizeStyle = {
+    [Combobox_types_1.ComboboxSize.Default]: (0, emotion_1.css) `
+    font-size: ${tokens_1.typeScales.body1.fontSize}px;
+    line-height: ${tokens_1.typeScales.body1.lineHeight}px;
+    min-height: ${Menu_styles_1.menuItemHeight[Combobox_types_1.ComboboxSize.Default]}px;
+    padding: ${Menu_styles_1.menuItemPadding[Combobox_types_1.ComboboxSize.Default].y}px
+      ${Menu_styles_1.menuItemPadding[Combobox_types_1.ComboboxSize.Default].x}px;
+    gap: ${tokens_1.spacing[1]}px;
+
+    &:before {
+      max-height: ${Menu_styles_1.menuItemHeight[Combobox_types_1.ComboboxSize.Default]}px;
+    }
+  `,
+    [Combobox_types_1.ComboboxSize.Large]: (0, emotion_1.css) `
+    font-size: ${tokens_1.typeScales.body2.fontSize}px;
+    line-height: ${tokens_1.typeScales.body2.lineHeight}px;
+    min-height: ${Menu_styles_1.menuItemHeight[Combobox_types_1.ComboboxSize.Large]}px;
+    padding: ${Menu_styles_1.menuItemPadding[Combobox_types_1.ComboboxSize.Large].y}px
+      ${Menu_styles_1.menuItemPadding[Combobox_types_1.ComboboxSize.Large].x}px;
+    gap: ${tokens_1.spacing[2]}px;
+
+    &:before {
+      max-height: ${Menu_styles_1.menuItemHeight[Combobox_types_1.ComboboxSize.Large]}px;
+    }
+  `,
+};
+const _comboboxOptionBaseActiveStyle = (0, emotion_1.css) `
+  outline: none;
+
+  &:before {
+    transform: scaleY(1);
+  }
+`;
+const comboboxOptionActiveStyle = {
+    [lib_1.Theme.Light]: (0, emotion_1.css) `
+    ${_comboboxOptionBaseActiveStyle};
+    background-color: ${palette_1.palette.blue.light3};
+
+    &:before {
+      background-color: ${palette_1.palette.blue.base};
+    }
+  `,
+    [lib_1.Theme.Dark]: (0, emotion_1.css) `
+    ${_comboboxOptionBaseActiveStyle};
+    background-color: ${palette_1.palette.blue.dark3};
+
+    &:before {
+      background-color: ${palette_1.palette.blue.light1};
+    }
+  `,
+};
+const _comboboxOptionBaseDisabledStyle = (0, emotion_1.css) `
+  cursor: not-allowed;
+
+  &:hover {
+    background-color: inherit;
+  }
+
+  &:before {
+    content: unset;
+  }
+`;
+const comboboxOptionDisabledStyle = {
+    [lib_1.Theme.Light]: (0, emotion_1.css) `
+    ${_comboboxOptionBaseDisabledStyle};
+    color: ${palette_1.palette.gray.light1};
+  `,
+    [lib_1.Theme.Dark]: (0, emotion_1.css) `
+    ${_comboboxOptionBaseDisabledStyle};
+    color: ${palette_1.palette.gray.dark1};
+  `,
+};
+const checkIconStyle = {
+    [Combobox_types_1.ComboboxSize.Default]: (0, emotion_1.css) `
+    min-width: ${tokens_1.spacing[3]}px;
+  `,
+    [Combobox_types_1.ComboboxSize.Large]: (0, emotion_1.css) `
+    min-width: ${tokens_1.spacing[4]}px;
+  `,
+};
+const flexSpan = (0, emotion_1.css) `
+  display: inline-flex;
+  gap: 8px;
+  justify-content: start;
+  align-items: inherit;
+  overflow-wrap: anywhere;
+`;
+const disallowPointer = (0, emotion_1.css) `
+  pointer-events: none;
+`;
+const displayNameStyle = (isSelected) => (0, emotion_1.css) `
+  font-weight: ${isSelected ? 'bold' : 'normal'};
+`;
+const InternalComboboxOption = react_1.default.forwardRef(({ displayName, glyph, isSelected, isFocused, disabled, setSelected, className, description, }, forwardedRef) => {
+    const { multiselect, darkMode, theme, withIcons, inputValue, size, searchInputSize, } = (0, react_1.useContext)(ComboboxContext_1.ComboboxContext);
+    const optionTextId = (0, hooks_1.useIdAllocator)({ prefix: 'combobox-option-text' });
+    const optionRef = (0, hooks_1.useForwardedRef)(forwardedRef, null);
+    const handleOptionClick = (0, react_1.useCallback)((e) => {
+        e.stopPropagation();
+        if (!disabled) {
+            setSelected();
+        }
+    }, [disabled, optionRef, setSelected]);
+    const renderedIcon = (0, react_1.useMemo)(() => {
+        if (glyph) {
+            if ((0, icon_1.isComponentGlyph)(glyph)) {
+                return glyph;
+            }
+            console.error('`ComboboxOption` instance did not render icon because it is not a known glyph element.', glyph);
+        }
+    }, [glyph]);
+    const renderedChildren = (0, react_1.useMemo)(() => {
+        if (multiselect) {
+            const checkbox = (react_1.default.createElement(checkbox_1.default, { "aria-labelledby": optionTextId, checked: isSelected, tabIndex: -1, disabled: disabled, darkMode: darkMode, className: (0, emotion_1.css) `
+              // TODO: Remove when this is resolved:
+              // https://jira.mongodb.org/browse/PD-2171
+              & > label > div {
+                margin-top: 0;
+              }
+            ` }));
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement("span", { className: optionNameStyles(searchInputSize) },
+                    react_1.default.createElement("span", { className: (0, emotion_1.cx)(flexSpan, disallowPointer) },
+                        withIcons ? renderedIcon : checkbox,
+                        react_1.default.createElement("span", { id: optionTextId, className: displayNameStyle(isSelected) }, (0, utils_1.wrapJSX)(displayName, inputValue, 'strong'))),
+                    withIcons && checkbox),
+                description && react_1.default.createElement("span", null, description)));
+        }
+        return (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("span", { className: optionNameStyles(searchInputSize) },
+                react_1.default.createElement("span", { className: (0, emotion_1.cx)(flexSpan, disallowPointer) },
+                    renderedIcon,
+                    react_1.default.createElement("span", { className: displayNameStyle(isSelected) }, (0, utils_1.wrapJSX)(displayName, inputValue, 'strong'))),
+                isSelected && (react_1.default.createElement(icon_1.default, { glyph: "Checkmark", className: checkIconStyle[size], color: darkMode ? palette_1.palette.blue.light1 : palette_1.palette.blue.base }))),
+            description && react_1.default.createElement("span", null, description)));
+    }, [
+        multiselect,
+        renderedIcon,
+        isSelected,
+        displayName,
+        inputValue,
+        size,
+        darkMode,
+        optionTextId,
+        disabled,
+        withIcons,
+    ]);
+    return (react_1.default.createElement("li", { ref: optionRef, role: "option", "aria-selected": isFocused, "aria-label": displayName, tabIndex: -1, className: (0, emotion_1.cx)(comboboxOptionBaseStyle, comboboxOptionSizeStyle[size], comboboxOptionThemeStyle[theme], {
+            [comboboxOptionActiveStyle[theme]]: isFocused,
+            [comboboxOptionDisabledStyle[theme]]: disabled,
+        }, className), onClick: handleOptionClick, onKeyDown: handleOptionClick }, renderedChildren));
+});
+exports.InternalComboboxOption = InternalComboboxOption;
+InternalComboboxOption.displayName = 'ComboboxOption';
+function ComboboxOption(_) {
+    throw Error('`ComboboxOption` must be a child of a `Combobox` instance');
+}
+exports.ComboboxOption = ComboboxOption;
+ComboboxOption.displayName = 'ComboboxOption';
+ComboboxOption.propTypes = {
+    displayName: prop_types_1.default.string,
+    value: prop_types_1.default.string,
+    glyph: prop_types_1.default.node,
+    disabled: prop_types_1.default.bool,
+    className: prop_types_1.default.string,
+};
+//# sourceMappingURL=ComboboxOption.js.map

package/lib/components/combobox/ComboboxOption.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboboxOption.js","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxOption.tsx"],"names":[],"mappings":"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"}

package/lib/components/combobox/Menu.styles.d.ts

@@ -0,0 +1,18 @@
+import { Theme } from '@leafygreen-ui/lib';
+import { ComboboxSize } from './Combobox.types';
+export declare const menuItemHeight = 36;
+export declare const menuItemPadding: Record<ComboboxSize, {
+    x: number;
+    y: number;
+}>;
+export declare const popoverStyle: (width?: number) => string;
+export declare const popoverThemeStyle: Record<Theme, string>;
+export declare const menuBaseStyle: string;
+export declare const menuThemeStyle: Record<Theme, string>;
+export declare const menuList: string;
+export declare const menuMessageBaseStyle: string;
+export declare const menuMessageThemeStyle: Record<Theme, string>;
+export declare const menuMessageSizeStyle: Record<ComboboxSize, string>;
+export declare const menuMessageIconSizeStyle: Record<ComboboxSize, string>;
+export declare const loadingIconStyle: string;
+//# sourceMappingURL=Menu.styles.d.ts.map