@mongodb-js/compass-components 0.17.0 → 1.0.0

package/lib/components/editor.d.ts

@@ -22,13 +22,14 @@ declare const EditorVariant: {
 declare type EditorProps = {
     variant: keyof typeof EditorVariant;
     text?: string;
+    id?: string;
     options?: Omit<IAceOptions, 'readOnly'>;
     readOnly?: boolean;
     completer?: unknown;
     'data-testid'?: string;
     onChangeText?: (text: string, event?: any) => void;
 } & Omit<IAceEditorProps, 'onChange' | 'value'>;
-declare function Editor({ text, variant, options, readOnly, onChangeText, completer, onFocus, 'data-testid': dataTestId, ...aceProps }: EditorProps): React.ReactElement;
+declare function Editor({ text, variant, options, readOnly, id, onChangeText, completer, onFocus, 'data-testid': dataTestId, ...aceProps }: EditorProps): React.ReactElement;
 declare function setEditorValue(element: HTMLElement, value: string): void;
 declare const EditorTextCompleter: any;
 export { Editor, EditorVariant, EditorTextCompleter, setEditorValue };

package/lib/components/editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../src/components/editor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,OAAO,YAAY,CAAC;AACpB,OAAO,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE9D,OAAO,8CAA8C,CAAC;AACtD,OAAO,2CAA2C,CAAC;AACnD,OAAO,qCAAqC,CAAC;AAC7C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,oCAAoC,CAAC;AAE5C,OAAO,kBAAkB,CAAC;AAC1B,OAAO,gCAAgC,CAAC;AACxC,OAAO,sCAAsC,CAAC;AAiB9C,QAAA,MAAM,aAAa;;;;CAIT,CAAC;AAEX,aAAK,WAAW,GAAG;IACjB,OAAO,EAAE,MAAM,OAAO,aAAa,CAAC;IACpC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;CACpD,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAEhD,iBAAS,MAAM,CAAC,EACd,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,OAAO,EACP,aAAa,EAAE,UAAU,EACzB,GAAG,QAAQ,EACZ,EAAE,WAAW,GAAG,KAAK,CAAC,YAAY,CA4ClC;AAUD,iBAAS,cAAc,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAMjE;AAED,QAAA,MAAM,mBAAmB,KAAsB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,mBAAmB,EAAE,cAAc,EAAE,CAAC"}
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../src/components/editor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAYvD,OAAO,YAAY,CAAC;AACpB,OAAO,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE9D,OAAO,8CAA8C,CAAC;AACtD,OAAO,2CAA2C,CAAC;AACnD,OAAO,qCAAqC,CAAC;AAC7C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,oCAAoC,CAAC;AAE5C,OAAO,kBAAkB,CAAC;AAC1B,OAAO,gCAAgC,CAAC;AACxC,OAAO,sCAAsC,CAAC;AAiB9C,QAAA,MAAM,aAAa;;;;CAIT,CAAC;AAEX,aAAK,WAAW,GAAG;IACjB,OAAO,EAAE,MAAM,OAAO,aAAa,CAAC;IACpC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;CACpD,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAEhD,iBAAS,MAAM,CAAC,EACd,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAQ,EACR,EAAE,EACF,YAAY,EACZ,SAAS,EACT,OAAO,EACP,aAAa,EAAE,UAAU,EACzB,GAAG,QAAQ,EACZ,EAAE,WAAW,GAAG,KAAK,CAAC,YAAY,CAuDlC;AAUD,iBAAS,cAAc,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAMjE;AAED,QAAA,MAAM,mBAAmB,KAAsB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,mBAAmB,EAAE,cAAc,EAAE,CAAC"}

package/lib/components/editor.js

@@ -1,10 +1,33 @@
 "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.setEditorValue = exports.EditorTextCompleter = exports.EditorVariant = exports.Editor = void 0;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const utils_1 = require("@react-aria/utils");
 if (typeof window === 'undefined' && typeof globalThis !== 'undefined') {
     globalThis.window = {};
@@ -42,7 +65,7 @@ const EditorVariant = {
     Generic: 'Generic',
 };
 exports.EditorVariant = EditorVariant;
-function Editor({ text, variant, options, readOnly, onChangeText, completer, onFocus, 'data-testid': dataTestId, ...aceProps }) {
+function Editor({ text, variant, options, readOnly, id, onChangeText, completer, onFocus, 'data-testid': dataTestId, ...aceProps }) {
     var _a;
     const setOptions = {
         ...DEFAULT_OPTIONS,
@@ -51,12 +74,18 @@ function Editor({ text, variant, options, readOnly, onChangeText, completer, onF
         ...(variant === 'Shell' && { mode: 'ace/mode/mongodb' }),
         ...(!!completer && { enableLiveAutocompletion: true }),
     };
-    const editorId = (0, utils_1.useId)();
-    const editor = (react_1.default.createElement(react_ace_1.default, { mode: variant === 'Generic'
+    const editorRef = (0, react_1.useRef)(null);
+    (0, react_1.useLayoutEffect)(() => {
+        if (id && editorRef.current) {
+            editorRef.current.editor.textInput.getElement().id = id;
+        }
+    }, [id]);
+    const editorName = (0, utils_1.useId)();
+    const editor = (react_1.default.createElement(react_ace_1.default, { ref: (ref) => (editorRef.current = ref), mode: variant === 'Generic'
             ? undefined
             : variant === 'EJSON'
                 ? 'json'
-                : 'javascript', theme: "mongodb", width: "100%", value: text, onChange: onChangeText, editorProps: { $blockScrolling: Infinity }, setOptions: setOptions, readOnly: readOnly, commands: ext_beautify_1.default.commands, name: (_a = aceProps.name) !== null && _a !== void 0 ? _a : editorId, ...aceProps, onFocus: (ev) => {
+                : 'javascript', theme: "mongodb", width: "100%", value: text, onChange: onChangeText, editorProps: { $blockScrolling: Infinity }, setOptions: setOptions, readOnly: readOnly, commands: ext_beautify_1.default.commands, name: (_a = aceProps.name) !== null && _a !== void 0 ? _a : editorName, ...aceProps, onFocus: (ev) => {
             if (completer) {
                 ext_language_tools_1.default.setCompleters([completer]);
             }

package/lib/components/editor.js.map

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

package/lib/components/leafy-green/combobox/chip.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ChipProps } from './combobox-types';
+export declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLSpanElement>>;
+//# sourceMappingURL=chip.d.ts.map

package/lib/components/leafy-green/combobox/chip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../../../src/components/leafy-green/combobox/chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAgB,MAAM,kBAAkB,CAAC;AAmGhE,eAAO,MAAM,IAAI,mFAyHhB,CAAC"}

package/lib/components/leafy-green/combobox/chip.js

@@ -0,0 +1,182 @@
+"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.Chip = void 0;
+const react_1 = __importStar(require("react"));
+const icon_1 = __importDefault(require("@leafygreen-ui/icon"));
+const combobox_context_1 = require("./combobox-context");
+const emotion_1 = require("@leafygreen-ui/emotion");
+const palette_1 = require("@leafygreen-ui/palette");
+const inline_definition_1 = __importDefault(require("@leafygreen-ui/inline-definition"));
+const lib_1 = require("@leafygreen-ui/lib");
+const util_1 = require("./util");
+const chipWrapperStyle = ({ darkMode, size, }) => {
+    let chipModeStyle, chipSizeStyle;
+    if (darkMode) {
+        chipModeStyle = (0, emotion_1.css) ``;
+    }
+    else {
+        chipModeStyle = (0, emotion_1.css) `
+      --lg-combobox-chip-text-color: ${palette_1.uiColors.gray.dark3};
+      --lg-combobox-chip-icon-color: ${palette_1.uiColors.gray.dark2};
+      --lg-combobox-chip-background-color: ${palette_1.uiColors.gray.light2};
+      --lg-combobox-chip-hover-color: ${palette_1.uiColors.gray.light1};
+      --lg-combobox-chip-focus-color: ${palette_1.uiColors.blue.light2};
+    `;
+    }
+    switch (size) {
+        case 'default':
+            chipSizeStyle = (0, emotion_1.css) `
+        --lg-combobox-chip-height: 24px;
+        --lg-combobox-chip-border-radius: 4px;
+        --lg-combobox-chip-font-size: 14px;
+        --lg-combobox-chip-line-height: 20px;
+        --lg-combobox-chip-padding-x: 6px;
+      `;
+            break;
+    }
+    return (0, emotion_1.cx)(chipModeStyle, chipSizeStyle, (0, emotion_1.css) `
+      display: inline-flex;
+      align-items: center;
+      overflow: hidden;
+      white-space: nowrap;
+      height: var(--lg-combobox-chip-height);
+      font-size: var(--lg-combobox-chip-font-size);
+      line-height: var(--lg-combobox-chip-line-height);
+      border-radius: var(--lg-combobox-chip-border-radius);
+      color: var(--lg-combobox-chip-text-color);
+      background-color: var(--lg-combobox-chip-background-color);
+
+      // TODO - refine these styles
+      /* &:focus, */
+      &:focus-within {
+        background-color: var(--lg-combobox-chip-focus-color);
+      }
+    `);
+};
+const chipText = (0, emotion_1.css) `
+  padding-inline: var(--lg-combobox-chip-padding-x);
+`;
+const chipButton = (0, emotion_1.css) `
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+  outline: none;
+  border: none;
+  background-color: transparent;
+  color: var(--lg-combobox-chip-icon-color);
+  cursor: pointer;
+  transition: background-color 100ms ease-in-out;
+
+  &:before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 1px;
+    background-color: var(--lg-combobox-chip-hover-color);
+  }
+
+  &:hover {
+    background-color: var(--lg-combobox-chip-hover-color);
+  }
+`;
+exports.Chip = react_1.default.forwardRef(({ displayName, isFocused, onRemove, onFocus }, forwardedRef) => {
+    const { darkMode, size, disabled, chipTruncationLocation, chipCharacterLimit = 12, } = (0, react_1.useContext)(combobox_context_1.ComboboxContext);
+    const isTruncated = !!chipCharacterLimit &&
+        !!chipTruncationLocation &&
+        chipTruncationLocation !== 'none' &&
+        displayName.length > chipCharacterLimit;
+    const buttonRef = (0, react_1.useRef)(null);
+    const truncatedName = (0, react_1.useMemo)(() => {
+        if (isTruncated) {
+            const ellipsis = '…';
+            const chars = chipCharacterLimit - 3;
+            switch (chipTruncationLocation) {
+                case 'start': {
+                    const end = displayName
+                        .substring(displayName.length - chars)
+                        .trim();
+                    return ellipsis + end;
+                }
+                case 'middle': {
+                    const start = displayName.substring(0, chars / 2).trim();
+                    const end = displayName
+                        .substring(displayName.length - chars / 2)
+                        .trim();
+                    return start + ellipsis + end;
+                }
+                case 'end': {
+                    const start = displayName.substring(0, chars).trim();
+                    return start + ellipsis;
+                }
+                default: {
+                    return displayName;
+                }
+            }
+        }
+        return false;
+    }, [chipCharacterLimit, chipTruncationLocation, displayName, isTruncated]);
+    (0, react_1.useEffect)(() => {
+        var _a;
+        if (isFocused && !disabled) {
+            (_a = buttonRef === null || buttonRef === void 0 ? void 0 : buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+    }, [disabled, forwardedRef, isFocused]);
+    const handleKeyDown = (e) => {
+        if (!disabled &&
+            (e.keyCode === util_1.keyMap.Delete ||
+                e.keyCode === util_1.keyMap.Backspace ||
+                e.keyCode === util_1.keyMap.Enter ||
+                e.keyCode === util_1.keyMap.Space)) {
+            onRemove();
+        }
+    };
+    const handleChipClick = (e) => {
+        var _a;
+        if (!((_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
+            onFocus();
+        }
+    };
+    const handleButtonClick = () => {
+        if (!disabled) {
+            onRemove();
+        }
+    };
+    const dataProp = (0, lib_1.createDataProp)('combobox-chip');
+    return (react_1.default.createElement("span", { role: "option", "aria-selected": isFocused, "data-test-id": "lg-combobox-chip", ...dataProp.prop, ref: forwardedRef, className: chipWrapperStyle({ darkMode, size }), onClick: handleChipClick, tabIndex: -1 },
+        react_1.default.createElement("span", { className: chipText }, truncatedName ? (react_1.default.createElement(inline_definition_1.default, { definition: displayName, align: "bottom" }, truncatedName)) : (displayName)),
+        react_1.default.createElement("button", { "aria-label": `Deselect ${displayName}`, "aria-disabled": disabled, disabled: disabled, ref: buttonRef, className: chipButton, onClick: handleButtonClick, onKeyDown: handleKeyDown },
+            react_1.default.createElement(icon_1.default, { glyph: "X" }))));
+});
+exports.Chip.displayName = 'Chip';
+//# sourceMappingURL=chip.js.map

package/lib/components/leafy-green/combobox/chip.js.map

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

package/lib/components/leafy-green/combobox/combobox-context.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import type { ComboboxSize, TrunctationLocation } from './combobox-types';
+interface ComboboxData {
+    multiselect: boolean;
+    darkMode: boolean;
+    size: keyof typeof ComboboxSize;
+    withIcons: boolean;
+    disabled: boolean;
+    chipTruncationLocation?: TrunctationLocation;
+    chipCharacterLimit?: number;
+    inputValue?: string;
+}
+export declare const ComboboxContext: import("react").Context<ComboboxData>;
+export {};
+//# sourceMappingURL=combobox-context.d.ts.map

package/lib/components/leafy-green/combobox/combobox-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-context.d.ts","sourceRoot":"","sources":["../../../../src/components/leafy-green/combobox/combobox-context.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE1E,UAAU,YAAY;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,MAAM,OAAO,YAAY,CAAC;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,sBAAsB,CAAC,EAAE,mBAAmB,CAAC;IAC7C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,eAAe,uCAM1B,CAAC"}

package/lib/components/leafy-green/combobox/combobox-context.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ComboboxContext = void 0;
+const react_1 = require("react");
+exports.ComboboxContext = (0, react_1.createContext)({
+    multiselect: false,
+    darkMode: false,
+    size: 'default',
+    withIcons: false,
+    disabled: false,
+});
+//# sourceMappingURL=combobox-context.js.map

package/lib/components/leafy-green/combobox/combobox-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-context.js","sourceRoot":"","sources":["../../../../src/components/leafy-green/combobox/combobox-context.tsx"],"names":[],"mappings":";;;AAAA,iCAAsC;AAczB,QAAA,eAAe,GAAG,IAAA,qBAAa,EAAe;IACzD,WAAW,EAAE,KAAK;IAClB,QAAQ,EAAE,KAAK;IACf,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,KAAK;IAChB,QAAQ,EAAE,KAAK;CAChB,CAAC,CAAC"}

package/lib/components/leafy-green/combobox/combobox-group.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { ComboboxGroupProps } from './combobox-types';
+export declare function InternalComboboxGroup({ label, className, children, }: ComboboxGroupProps): JSX.Element;
+declare function ComboboxGroup(): JSX.Element;
+declare namespace ComboboxGroup {
+    var displayName: string;
+}
+export default ComboboxGroup;
+//# sourceMappingURL=combobox-group.d.ts.map

package/lib/components/leafy-green/combobox/combobox-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-group.d.ts","sourceRoot":"","sources":["../../../../src/components/leafy-green/combobox/combobox-group.tsx"],"names":[],"mappings":";AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AA4B3D,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CAkBlC;AAID,iBAAwB,aAAa,IAAI,GAAG,CAAC,OAAO,CAEnD;kBAFuB,aAAa;;;eAAb,aAAa"}

package/lib/components/leafy-green/combobox/combobox-group.js

@@ -0,0 +1,69 @@
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InternalComboboxGroup = void 0;
+const emotion_1 = require("@leafygreen-ui/emotion");
+const hooks_1 = require("@leafygreen-ui/hooks");
+const palette_1 = require("@leafygreen-ui/palette");
+const react_1 = __importStar(require("react"));
+const combobox_context_1 = require("./combobox-context");
+const comboboxGroupStyle = (darkMode) => (0, emotion_1.css) `
+  --lg-combobox-group-label-color: ${darkMode
+    ? palette_1.uiColors.gray.light1
+    : palette_1.uiColors.gray.dark1};
+  --lg-combobox-group-border-color: ${darkMode
+    ? palette_1.uiColors.gray.dark1
+    : palette_1.uiColors.gray.light1};
+  padding-top: 8px;
+  border-bottom: 1px solid var(--lg-combobox-group-border-color);
+`;
+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;
+  color: var(--lg-combobox-group-label-color);
+`;
+function InternalComboboxGroup({ label, className, children, }) {
+    const { darkMode } = (0, react_1.useContext)(combobox_context_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(darkMode), className) },
+        react_1.default.createElement("div", { className: comboboxGroupLabel, 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';
+function ComboboxGroup() {
+    throw Error('`ComboboxGroup` must be a child of a `Combobox` instance');
+}
+exports.default = ComboboxGroup;
+//# sourceMappingURL=combobox-group.js.map

package/lib/components/leafy-green/combobox/combobox-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-group.js","sourceRoot":"","sources":["../../../../src/components/leafy-green/combobox/combobox-group.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,oDAAiD;AACjD,gDAAsD;AACtD,oDAAkD;AAClD,+CAA0C;AAE1C,yDAAqD;AAErD,MAAM,kBAAkB,GAAG,CAAC,QAAiB,EAAE,EAAE,CAAC,IAAA,aAAG,EAAA;qCAChB,QAAQ;IACzC,CAAC,CAAC,kBAAQ,CAAC,IAAI,CAAC,MAAM;IACtB,CAAC,CAAC,kBAAQ,CAAC,IAAI,CAAC,KAAK;sCACa,QAAQ;IAC1C,CAAC,CAAC,kBAAQ,CAAC,IAAI,CAAC,KAAK;IACrB,CAAC,CAAC,kBAAQ,CAAC,IAAI,CAAC,MAAM;;;CAGzB,CAAC;AAEF,MAAM,kBAAkB,GAAG,IAAA,aAAG,EAAA;;;;;;;;;;;;CAY7B,CAAC;AAEF,SAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,QAAQ,GACW;IACnB,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,kBAAU,EAAC,kCAAe,CAAC,CAAC;IAEjD,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,QAAQ,CAAC,EAAE,SAAS,CAAC;QACzD,uCAAK,SAAS,EAAE,kBAAkB,EAAE,EAAE,EAAE,OAAO,IAC5C,KAAK,CACF;QACN,uCAAK,IAAI,EAAC,OAAO,qBAAkB,OAAO,IACvC,QAAQ,CACL,CACF,CACP,CAAC,CAAC,CAAC,CACF,6DAAK,CACN,CAAC;AACJ,CAAC;AAtBD,sDAsBC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC;AAE5C,SAAwB,aAAa;IACnC,MAAM,KAAK,CAAC,0DAA0D,CAAC,CAAC;AAC1E,CAAC;AAFD,gCAEC"}

package/lib/components/leafy-green/combobox/combobox-option.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { InternalComboboxOptionProps } from './combobox-types';
+declare const InternalComboboxOption: React.ForwardRefExoticComponent<InternalComboboxOptionProps & React.RefAttributes<HTMLLIElement>>;
+export { InternalComboboxOption };
+declare function ComboboxOption(): JSX.Element;
+declare namespace ComboboxOption {
+    var displayName: string;
+}
+export default ComboboxOption;
+//# sourceMappingURL=combobox-option.d.ts.map

package/lib/components/leafy-green/combobox/combobox-option.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-option.d.ts","sourceRoot":"","sources":["../../../../src/components/leafy-green/combobox/combobox-option.tsx"],"names":[],"mappings":"AACA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAMhE,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,kBAAkB,CAAC;AA+DpE,QAAA,MAAM,sBAAsB,mGAwH3B,CAAC;AAGF,OAAO,EAAE,sBAAsB,EAAE,CAAC;AAClC,iBAAwB,cAAc,IAAI,GAAG,CAAC,OAAO,CAEpD;kBAFuB,cAAc;;;eAAd,cAAc"}

package/lib/components/leafy-green/combobox/combobox-option.js

@@ -0,0 +1,142 @@
+"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.InternalComboboxOption = void 0;
+const emotion_1 = require("@leafygreen-ui/emotion");
+const react_1 = __importStar(require("react"));
+const palette_1 = require("@leafygreen-ui/palette");
+const lib_1 = require("@leafygreen-ui/lib");
+const hooks_1 = require("@leafygreen-ui/hooks");
+const checkbox_1 = __importDefault(require("@leafygreen-ui/checkbox"));
+const icon_1 = __importStar(require("@leafygreen-ui/icon"));
+const combobox_context_1 = require("./combobox-context");
+const util_1 = require("./util");
+const comboboxOptionStyle = () => (0, emotion_1.css) `
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  list-style: none;
+  color: inherit;
+  cursor: pointer;
+  overflow: hidden;
+  font-size: var(--lg-combobox-item-font-size);
+  line-height: var(--lg-combobox-item-line-height);
+  padding: var(--lg-combobox-item-padding-y) var(--lg-combobox-item-padding-x);
+
+  &:before {
+    content: '';
+    position: absolute;
+    left: 0;
+    width: 3px;
+    height: var(--lg-combobox-item-wedge-height);
+    background-color: transparent;
+    border-radius: 0 2px 2px 0;
+    transform: scaleY(0.3);
+    transition: 150ms ease-in-out;
+    transition-property: transform, background-color;
+  }
+
+  &:hover {
+    outline: none;
+    background-color: var(--lg-combobox-item-hover-color);
+  }
+
+  &[aria-selected='true'] {
+    outline: none;
+    background-color: var(--lg-combobox-item-active-color);
+
+    &:before {
+      background-color: var(--lg-combobox-item-wedge-color);
+      transform: scaleY(1);
+    }
+  }
+`;
+const flexSpan = (0, emotion_1.css) `
+  display: inline-flex;
+  gap: 8px;
+  justify-content: start;
+  align-items: inherit;
+`;
+const displayNameStyle = (isSelected) => (0, emotion_1.css) `
+  font-weight: ${isSelected ? 'bold' : 'normal'};
+`;
+const InternalComboboxOption = react_1.default.forwardRef(({ displayName, glyph, isSelected, isFocused, setSelected, className, }, forwardedRef) => {
+    const { multiselect, darkMode, withIcons, inputValue } = (0, react_1.useContext)(combobox_context_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 (e.target === optionRef.current ||
+            e.target.tagName === 'INPUT' ||
+            e.target.tagName === 'SPAN') {
+            setSelected();
+        }
+    }, [optionRef, setSelected]);
+    const renderedIcon = (0, react_1.useMemo)(() => {
+        if (glyph) {
+            if ((0, icon_1.isComponentGlyph)(glyph) || (0, lib_1.isComponentType)(glyph, 'Icon')) {
+                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, { label: "", "aria-labelledby": optionTextId, checked: isSelected, tabIndex: -1, animate: false }));
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement("span", { className: flexSpan },
+                    withIcons ? renderedIcon : checkbox,
+                    react_1.default.createElement("span", { id: optionTextId, className: displayNameStyle(isSelected) }, (0, util_1.wrapJSX)(displayName, inputValue, 'strong'))),
+                withIcons && checkbox));
+        }
+        return (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("span", { className: flexSpan },
+                renderedIcon,
+                react_1.default.createElement("span", { className: displayNameStyle(isSelected) }, (0, util_1.wrapJSX)(displayName, inputValue, 'strong'))),
+            isSelected && (react_1.default.createElement(icon_1.default, { glyph: "Checkmark", color: darkMode ? palette_1.uiColors.blue.light1 : palette_1.uiColors.blue.base }))));
+    }, [
+        multiselect,
+        renderedIcon,
+        isSelected,
+        displayName,
+        inputValue,
+        darkMode,
+        optionTextId,
+        withIcons,
+    ]);
+    return (react_1.default.createElement("li", { ref: optionRef, role: "option", "aria-selected": isFocused, "aria-label": displayName, tabIndex: -1, className: (0, emotion_1.cx)(comboboxOptionStyle(), className), onClick: handleOptionClick, onKeyPress: handleOptionClick }, renderedChildren));
+});
+exports.InternalComboboxOption = InternalComboboxOption;
+InternalComboboxOption.displayName = 'ComboboxOption';
+function ComboboxOption() {
+    throw Error('`ComboboxOption` must be a child of a `Combobox` instance');
+}
+exports.default = ComboboxOption;
+ComboboxOption.displayName = 'ComboboxOption';
+//# sourceMappingURL=combobox-option.js.map

package/lib/components/leafy-green/combobox/combobox-option.js.map

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