diff --git a/js_modules/dagster-ui/packages/app-oss/tsconfig.json b/js_modules/dagster-ui/packages/app-oss/tsconfig.json
index fc2d305c048ae..5345f969e6b42 100644
--- a/js_modules/dagster-ui/packages/app-oss/tsconfig.json
+++ b/js_modules/dagster-ui/packages/app-oss/tsconfig.json
@@ -3,6 +3,7 @@
"paths": {
"@dagster-io/ui-core/*": ["../ui-core/src/*"],
"@dagster-io/ui-components": ["../ui-components/src"],
+ "@dagster-io/ui-components/editor": ["../ui-components/src/editor"],
"shared/*": ["../ui-core/src/*"]
},
"module": "esnext",
diff --git a/js_modules/dagster-ui/packages/ui-components/CHANGES.md b/js_modules/dagster-ui/packages/ui-components/CHANGES.md
index 17f3c1cdafd7d..52e39450f4a98 100644
--- a/js_modules/dagster-ui/packages/ui-components/CHANGES.md
+++ b/js_modules/dagster-ui/packages/ui-components/CHANGES.md
@@ -1,3 +1,7 @@
+# 1.2.1 (December 5, 2024)
+
+- Split CodeMirror-based components out of main index export
+
# 1.2.0 (December 5, 2024)
- Migrate styled-components to v6
diff --git a/js_modules/dagster-ui/packages/ui-components/package.json b/js_modules/dagster-ui/packages/ui-components/package.json
index b178ac7801105..ca29def1f1bc4 100644
--- a/js_modules/dagster-ui/packages/ui-components/package.json
+++ b/js_modules/dagster-ui/packages/ui-components/package.json
@@ -1,6 +1,6 @@
{
"name": "@dagster-io/ui-components",
- "version": "1.2.0",
+ "version": "1.2.1",
"description": "Dagster UI Component Library",
"license": "Apache-2.0",
"main": "lib/index.js",
diff --git a/js_modules/dagster-ui/packages/ui-components/rollup.config.js b/js_modules/dagster-ui/packages/ui-components/rollup.config.js
index 10d98f392aca3..c20bcb32acb23 100644
--- a/js_modules/dagster-ui/packages/ui-components/rollup.config.js
+++ b/js_modules/dagster-ui/packages/ui-components/rollup.config.js
@@ -11,52 +11,68 @@ import styles from 'rollup-plugin-styles';
const extensions = ['.js', '.jsx', '.ts', '.tsx', '.css', '.svg'];
-export default {
- input: {
- index: './src/index.ts',
+const sharedPlugins = [
+ styles({
+ extract: true,
+ }),
+ json(),
+ url(),
+ image(),
+ babel({
+ babelHelpers: 'bundled',
+ exclude: 'node_modules/**',
+ extensions: ['.js', '.jsx', '.ts', '.tsx'],
+ }),
+ commonjs(),
+ polyfills(),
+ resolve({extensions, preferBuiltins: false}),
+];
- // Our core fonts, usable as global style components, e.g. ``.
- 'fonts/GlobalGeistMono': './src/fonts/GlobalGeistMono.tsx',
- 'fonts/GlobalGeist': './src/fonts/GlobalGeist.tsx',
+const sharedExternals = [
+ '@blueprintjs/core',
+ '@blueprintjs/popover2',
+ '@blueprintjs/select',
+ 'react',
+ 'react-dom',
+ 'react-is',
+ 'styled-components',
+ 'stylis',
+];
- // Components are listed here individually so that they may be imported
- // without pulling in the entire library.
- 'components/Box': './src/components/Box.tsx',
- 'components/Button': './src/components/Button.tsx',
- 'components/Color': './src/components/Color.tsx',
- 'components/Icon': './src/components/Icon.tsx',
+export default [
+ {
+ input: {
+ index: './src/index.ts',
+
+ // Our core fonts, usable as global style components, e.g. ``.
+ 'fonts/GlobalGeistMono': './src/fonts/GlobalGeistMono.tsx',
+ 'fonts/GlobalGeist': './src/fonts/GlobalGeist.tsx',
+
+ // Components are listed here individually so that they may be imported
+ // without pulling in the entire library.
+ 'components/Box': './src/components/Box.tsx',
+ 'components/Button': './src/components/Button.tsx',
+ 'components/Color': './src/components/Color.tsx',
+ 'components/Icon': './src/components/Icon.tsx',
+ },
+ output: {
+ dir: 'lib',
+ exports: 'named',
+ format: 'cjs',
+ sourcemap: true,
+ },
+ plugins: sharedPlugins,
+ external: [...sharedExternals, '@tanstack/react-virtual'],
},
- output: {
- dir: 'lib',
- exports: 'named',
- format: 'cjs',
- sourcemap: true,
+ {
+ input: './src/editor.ts',
+ output: {
+ dir: 'lib',
+ exports: 'named',
+ format: 'cjs',
+ sourcemap: true,
+ },
+ plugins: sharedPlugins,
+ external: sharedExternals,
},
- plugins: [
- styles({
- extract: true,
- }),
- json(),
- url(),
- image(),
- babel({
- babelHelpers: 'bundled',
- exclude: 'node_modules/**',
- extensions: ['.js', '.jsx', '.ts', '.tsx'],
- }),
- commonjs(),
- polyfills(),
- resolve({extensions, preferBuiltins: false}),
- ],
- external: [
- '@blueprintjs/core',
- '@blueprintjs/popover2',
- '@blueprintjs/select',
- '@tanstack/react-virtual',
- 'react',
- 'react-dom',
- 'react-is',
- 'styled-components',
- 'stylis',
- ],
-};
+];
diff --git a/js_modules/dagster-ui/packages/ui-components/src/editor.ts b/js_modules/dagster-ui/packages/ui-components/src/editor.ts
new file mode 100644
index 0000000000000..62a654c369f70
--- /dev/null
+++ b/js_modules/dagster-ui/packages/ui-components/src/editor.ts
@@ -0,0 +1,4 @@
+export * from './components/ConfigEditorDialog';
+export * from './components/ConfigEditorWithSchema';
+export * from './components/NewConfigEditor';
+export * from './components/StyledRawCodeMirror';
diff --git a/js_modules/dagster-ui/packages/ui-components/src/index.ts b/js_modules/dagster-ui/packages/ui-components/src/index.ts
index 1224d069e9637..ba72a801271cf 100644
--- a/js_modules/dagster-ui/packages/ui-components/src/index.ts
+++ b/js_modules/dagster-ui/packages/ui-components/src/index.ts
@@ -7,8 +7,6 @@ export * from './components/ButtonGroup';
export * from './components/ButtonLink';
export * from './components/Checkbox';
export * from './components/CollapsibleSection';
-export * from './components/ConfigEditorDialog';
-export * from './components/ConfigEditorWithSchema';
export * from './components/ConfigTypeSchema';
export * from './components/Countdown';
export * from './components/CursorControls';
@@ -25,7 +23,6 @@ export * from './components/MainContent';
export * from './components/Menu';
export * from './components/MetadataTable';
export * from './components/MiddleTruncate';
-export * from './components/NewConfigEditor';
export * from './components/NonIdealState';
export * from './components/Page';
export * from './components/PageHeader';
@@ -41,7 +38,6 @@ export * from './components/Spinner';
export * from './components/SpinnerWithText';
export * from './components/SplitPanelContainer';
export * from './components/StyledButton';
-export * from './components/StyledRawCodeMirror';
export * from './components/SubwayDot';
export * from './components/Suggest';
export * from './components/Table';
diff --git a/js_modules/dagster-ui/packages/ui-core/jest.config.js b/js_modules/dagster-ui/packages/ui-core/jest.config.js
index 3039f576f7a91..543a7785cd2aa 100644
--- a/js_modules/dagster-ui/packages/ui-core/jest.config.js
+++ b/js_modules/dagster-ui/packages/ui-core/jest.config.js
@@ -78,6 +78,7 @@ module.exports = {
'\\.(css|less)$': 'identity-obj-proxy',
'^worker-loader(.*)/workers/(.*)$': '/jest/mocks/$2',
'^@dagster-io/ui-components$': '/../ui-components/src/index',
+ '^@dagster-io/ui-components/editor$': '/../ui-components/src/editor',
'^shared/(.*)$': '/src/$1',
},
diff --git a/js_modules/dagster-ui/packages/ui-core/src/code-location/CodeLocationOverviewRoot.tsx b/js_modules/dagster-ui/packages/ui-core/src/code-location/CodeLocationOverviewRoot.tsx
index 1f998022e2330..8ddff35ccc7e7 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/code-location/CodeLocationOverviewRoot.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/code-location/CodeLocationOverviewRoot.tsx
@@ -5,9 +5,9 @@ import {
MiddleTruncate,
Mono,
SpinnerWithText,
- StyledRawCodeMirror,
Table,
} from '@dagster-io/ui-components';
+import {StyledRawCodeMirror} from '@dagster-io/ui-components/editor';
import {useContext, useMemo} from 'react';
import {CodeLocationPageHeader} from 'shared/code-location/CodeLocationPageHeader.oss';
import {CodeLocationServerSection} from 'shared/code-location/CodeLocationServerSection.oss';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/configeditor/ConfigEditorUtils.tsx b/js_modules/dagster-ui/packages/ui-core/src/configeditor/ConfigEditorUtils.tsx
index 8e8e256b5013c..81b2e24323da5 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/configeditor/ConfigEditorUtils.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/configeditor/ConfigEditorUtils.tsx
@@ -1,4 +1,4 @@
-import {YamlModeValidationResult} from '@dagster-io/ui-components';
+import {YamlModeValidationResult} from '@dagster-io/ui-components/editor';
import yaml from 'yaml';
import {gql} from '../apollo-client';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/instance/InstanceConcurrency.tsx b/js_modules/dagster-ui/packages/ui-core/src/instance/InstanceConcurrency.tsx
index f38e3f27114b1..3e72fa1ddc767 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/instance/InstanceConcurrency.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/instance/InstanceConcurrency.tsx
@@ -17,13 +17,13 @@ import {
PageHeader,
Popover,
Spinner,
- StyledRawCodeMirror,
Subheading,
Table,
Tag,
TextInput,
Tooltip,
} from '@dagster-io/ui-components';
+import {StyledRawCodeMirror} from '@dagster-io/ui-components/editor';
import * as React from 'react';
import {Link} from 'react-router-dom';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/instance/InstanceConfig.tsx b/js_modules/dagster-ui/packages/ui-core/src/instance/InstanceConfig.tsx
index 237c3ab20ddf2..71fca00ebf2d9 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/instance/InstanceConfig.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/instance/InstanceConfig.tsx
@@ -7,9 +7,9 @@ import {
Heading,
PageHeader,
Spinner,
- StyledRawCodeMirror,
Subheading,
} from '@dagster-io/ui-components';
+import {StyledRawCodeMirror} from '@dagster-io/ui-components/editor';
import CodeMirror from 'codemirror';
import {memo, useContext, useMemo} from 'react';
import {createGlobalStyle} from 'styled-components';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadRoot.tsx b/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadRoot.tsx
index c5aa0ccb46657..55843af536a40 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadRoot.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadRoot.tsx
@@ -1,4 +1,5 @@
-import {CodeMirrorInDialogStyle, Dialog, DialogHeader} from '@dagster-io/ui-components';
+import {Dialog, DialogHeader} from '@dagster-io/ui-components';
+import {CodeMirrorInDialogStyle} from '@dagster-io/ui-components/editor';
import {Redirect, useParams} from 'react-router-dom';
import {LaunchpadAllowedRoot} from './LaunchpadAllowedRoot';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadSession.tsx b/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadSession.tsx
index cbb164baf6422..6a64493550537 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadSession.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadSession.tsx
@@ -5,19 +5,21 @@ import {
ButtonLink,
Checkbox,
Colors,
- ConfigEditorHandle,
- ConfigEditorHelp,
- ConfigEditorHelpContext,
Dialog,
DialogFooter,
Group,
Icon,
- NewConfigEditor,
SplitPanelContainer,
SplitPanelContainerHandle,
TextInput,
- isHelpContextEqual,
} from '@dagster-io/ui-components';
+import {
+ ConfigEditorHandle,
+ ConfigEditorHelp,
+ ConfigEditorHelpContext,
+ NewConfigEditor,
+ isHelpContextEqual,
+} from '@dagster-io/ui-components/editor';
import uniqBy from 'lodash/uniqBy';
import * as React from 'react';
import {LaunchRootExecutionButton} from 'shared/launchpad/LaunchRootExecutionButton.oss';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/plugins/sql.tsx b/js_modules/dagster-ui/packages/ui-core/src/plugins/sql.tsx
index dca45836ffdd2..a1234d42ba834 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/plugins/sql.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/plugins/sql.tsx
@@ -1,4 +1,5 @@
-import {Button, Dialog, DialogFooter, Icon, StyledRawCodeMirror} from '@dagster-io/ui-components';
+import {Button, Dialog, DialogFooter, Icon} from '@dagster-io/ui-components';
+import {StyledRawCodeMirror} from '@dagster-io/ui-components/editor';
import {useEffect, useState} from 'react';
import {IPluginSidebarProps} from '../plugins';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/runs/RunConfigDialog.tsx b/js_modules/dagster-ui/packages/ui-core/src/runs/RunConfigDialog.tsx
index a302013baefb6..7dad84a6c971d 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/runs/RunConfigDialog.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/runs/RunConfigDialog.tsx
@@ -1,12 +1,5 @@
-import {
- Box,
- Button,
- Dialog,
- DialogFooter,
- Icon,
- StyledRawCodeMirror,
- Subheading,
-} from '@dagster-io/ui-components';
+import {Box, Button, Dialog, DialogFooter, Icon, Subheading} from '@dagster-io/ui-components';
+import {StyledRawCodeMirror} from '@dagster-io/ui-components/editor';
import styled from 'styled-components';
import {RunTags} from './RunTags';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/schedules/SchedulesNextTicks.tsx b/js_modules/dagster-ui/packages/ui-core/src/schedules/SchedulesNextTicks.tsx
index 9f6c89ceb6abd..9b2a14e373016 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/schedules/SchedulesNextTicks.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/schedules/SchedulesNextTicks.tsx
@@ -14,10 +14,10 @@ import {
NonIdealState,
Popover,
Spinner,
- StyledRawCodeMirror,
Subheading,
Table,
} from '@dagster-io/ui-components';
+import {StyledRawCodeMirror} from '@dagster-io/ui-components/editor';
import qs from 'qs';
import {memo, useEffect, useState} from 'react';
import {Link} from 'react-router-dom';
diff --git a/js_modules/dagster-ui/packages/ui-core/src/workspace/CodeLocationMenu.tsx b/js_modules/dagster-ui/packages/ui-core/src/workspace/CodeLocationMenu.tsx
index ac60eb02aa210..78846b9667bb8 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/workspace/CodeLocationMenu.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/workspace/CodeLocationMenu.tsx
@@ -6,9 +6,9 @@ import {
Menu,
MenuItem,
Popover,
- StyledRawCodeMirror,
Table,
} from '@dagster-io/ui-components';
+import {StyledRawCodeMirror} from '@dagster-io/ui-components/editor';
import {useMemo, useState} from 'react';
import * as yaml from 'yaml';
diff --git a/js_modules/dagster-ui/packages/ui-core/tsconfig.json b/js_modules/dagster-ui/packages/ui-core/tsconfig.json
index 542426ae2e138..91b6df638a3a0 100644
--- a/js_modules/dagster-ui/packages/ui-core/tsconfig.json
+++ b/js_modules/dagster-ui/packages/ui-core/tsconfig.json
@@ -2,6 +2,7 @@
"compilerOptions": {
"paths": {
"@dagster-io/ui-components": ["../ui-components/src"],
+ "@dagster-io/ui-components/editor": ["../ui-components/src/editor"],
"shared/*": ["./src/*"]
},
"module": "es2022",