Merge branch 'main' into ar/LG-5666-mcpui-app

Author: adamrasheed

.github/CODEOWNERS

@@ -1,7 +1,18 @@
 # project:chat
 chat/ @mongodb/lg-chat
 
+# project:deletion
+packages/wizard @mongodb/lg-deletion
+
+# project:mcp-ui
+apps/mcp-ui-app @mongodb/lg-mcp-ui
+mcp-ui @mongodb/lg-mcp-ui
+
 # project:time-input
 packages/date-picker @mongodb/lg-time-input
 packages/date-utils @mongodb/lg-time-input
 packages/time-input @mongodb/lg-time-input
+
+# catch-all rule: any file not matching a more specific rule below
+# will be assigned to @leafygreen-ui-maintainers
+* @mongodb/leafygreen-ui-maintainers

packages/code-editor/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @leafygreen-ui/code-editor
 
+## 1.0.1
+
+### Patch Changes
+
+- a7fc5a8: - Fixes stuck loading state
+  - Includes minor small visual improvements
+- Updated dependencies [d8c4e35]
+  - @leafygreen-ui/typography@22.2.1
+
 ## 1.0.0
 
 ### Major Changes

packages/code-editor/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafygreen-ui/code-editor",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "LeafyGreen UI Kit Code Editor",
   "main": "./dist/umd/index.js",
   "module": "./dist/esm/index.js",

packages/code-editor/src/CodeEditor.stories.tsx

@@ -43,6 +43,17 @@ const meta: StoryMetaType<typeof CodeEditor> = {
     controls: {
       exclude: [...storybookExcludedControlParams, 'extensions'],
     },
+    generate: {
+      args: {
+        width: '100%',
+      },
+      combineArgs: {
+        darkMode: [false, true],
+        baseFontSize: Object.values(BaseFontSize),
+        copyButtonAppearance: Object.values(CopyButtonAppearance),
+        enableLineNumbers: [true, false],
+      },
+    },
   },
   decorators: [
     (Story: StoryFn, context) => (
@@ -251,6 +262,35 @@ LiveExample.args = {
   ),
 };
 
+/** This asserts that the editor loads correctly when no defaults are provided. */
+export const NoDefaults = Template.bind({});
+NoDefaults.args = {
+  copyButtonAppearance: undefined,
+  customContextMenuItems: undefined,
+  enableClickableUrls: undefined,
+  enableCodeFolding: undefined,
+  enableLineNumbers: undefined,
+  enableLineWrapping: undefined,
+  enableSearchPanel: undefined,
+  baseFontSize: undefined,
+  forceParsing: undefined,
+  placeholder: undefined,
+  readOnly: undefined,
+  indentSize: undefined,
+  indentUnit: undefined,
+  isLoading: undefined,
+  defaultValue: undefined,
+  tooltips: undefined,
+  darkMode: undefined,
+  height: undefined,
+  maxHeight: '',
+  maxWidth: undefined,
+  minHeight: undefined,
+  minWidth: undefined,
+  preLoadedModules: undefined,
+  width: undefined,
+};
+
 export const Minimal = Template.bind({});
 Minimal.args = {
   enableLineNumbers: false,
@@ -416,3 +456,5 @@ export const WithPreLoadedModules: StoryObj<typeof CodeEditor> = {
     />
   ),
 };
+
+export const Generated = () => {};

packages/code-editor/src/CodeEditor/CodeEditor.tsx

@@ -90,7 +90,22 @@ const BaseCodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(
     const [undoDepth, setUndoDepth] = useState(0);
     const [redoDepth, setRedoDepth] = useState(0);
 
-    const { modules, isLoading } = useModules(props);
+    // Create normalized props object with all defaults applied
+    // This ensures that when we spread props, all default values are included
+    // Note: We spread props first, then override with destructured values (which have defaults applied)
+    // This ensures that if a prop is undefined in props, the default value is used
+    const normalizedProps: CodeEditorProps = {
+      ...props,
+      copyButtonAppearance,
+      enableSearchPanel,
+      extensions: consumerExtensions,
+      forceParsing: forceParsingProp,
+      isLoading: isLoadingProp,
+    };
+
+    const { modules, isLoading } = useModules({
+      ...normalizedProps,
+    });
 
     // Get formatting functionality
     const { formatCode, isFormattingAvailable } = useCodeFormatter({
@@ -102,11 +117,8 @@ const BaseCodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(
     const customExtensions = useExtensions({
       editorViewInstance: editorViewRef.current,
       props: {
-        ...props,
-        forceParsing: forceParsingProp,
+        ...normalizedProps,
         onChange: onChangeProp,
-        isLoading: isLoadingProp,
-        extensions: consumerExtensions,
         baseFontSize,
         /**
          * CodeEditorTooltip in particular renders outside of the LeafyGreenProvider
@@ -283,7 +295,7 @@ const BaseCodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(
 
     const searchPanelExtension = useSearchPanelExtension({
       props: {
-        ...props,
+        ...normalizedProps,
         darkMode,
         baseFontSize,
       },
@@ -335,7 +347,6 @@ const BaseCodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(
         !EditorView ||
         !Prec ||
         !commands ||
-        !searchModule ||
         !StateEffect
       ) {
         return;

packages/code-editor/src/SearchPanel/SearchPanel.styles.ts

@@ -88,7 +88,6 @@ export const findSectionStyles = css`
   display: flex;
   align-items: center;
   padding: ${spacing[200]}px;
-  height: 100%;
 `;
 
 export const replaceSectionStyles = css`
@@ -162,7 +161,3 @@ export const replaceInputContainerStyles = css`
 export const replaceButtonStyles = css`
   margin-left: ${spacing[100]}px;
 `;
-
-export const findInputStyles = css`
-  width: 100%;
-`;

packages/code-editor/src/SearchPanel/SearchPanel.tsx

@@ -32,7 +32,6 @@ import { Body, useUpdatedBaseFontSize } from '@leafygreen-ui/typography';
 import {
   closeButtonStyles,
   findInputContainerStyles,
-  findInputStyles,
   findOptionsContainerStyles,
   findSectionStyles,
   getContainerStyles,
@@ -294,7 +293,6 @@ export function SearchPanel({
               aria-labelledby="find"
               onChange={handleSearchQueryChange}
               onKeyDown={handleFindInputKeyDown}
-              className={findInputStyles}
               value={searchString}
               // CodeMirror looks for this attribute to refocus when CMD+F is pressed and the panel is already open
               main-field="true"

packages/typography/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @leafygreen-ui/typography
 
+## 22.2.1
+
+### Patch Changes
+
+- d8c4e35: [LG-5691](https://jira.mongodb.org/browse/LG-5691): in `Link` component, vertically align text and icons
+
 ## 22.2.0
 
 ### Minor Changes

packages/typography/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafygreen-ui/typography",
-  "version": "22.2.0",
+  "version": "22.2.1",
   "description": "leafyGreen UI Kit Typography",
   "main": "./dist/umd/index.js",
   "module": "./dist/esm/index.js",

packages/typography/src/Link/Link/Link.styles.ts

@@ -2,9 +2,12 @@ import { css } from '@leafygreen-ui/emotion';
 
 import { anchorClassName } from '../shared.styles';
 
+const ICON_TOP_OFFSET = 1;
+const NEW_TAB_ICON_LEFT_OFFSET = 2;
+
 export const arrowRightIconPersist = css`
   transform: translate3d(3px, 0, 0);
-  top: 1px;
+  top: ${ICON_TOP_OFFSET}px;
   position: relative;
 `;
 
@@ -13,7 +16,7 @@ export const arrowRightIconHover = css`
   transform: translate3d(-3px, 0, 0);
   transition: 100ms ease-in;
   transition-property: opacity, transform;
-  top: 1px;
+  top: ${ICON_TOP_OFFSET}px;
   position: relative;
 
   .${anchorClassName}:hover &, .${anchorClassName}[data-hover='true'] & {
@@ -24,7 +27,6 @@ export const arrowRightIconHover = css`
 
 export const openInNewTabStyles = css`
   position: relative;
-  bottom: 2px;
-  left: -1px;
-  height: 12px;
+  top: ${ICON_TOP_OFFSET}px;
+  left: ${NEW_TAB_ICON_LEFT_OFFSET}px;
 `;