diff --git a/package-lock.json b/package-lock.json index e05c4ccb994..32a167982db 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8576,88 +8576,6 @@ "url": "https://opencollective.com/node-fetch" } }, - "node_modules/@mongodb-js/diagramming": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/@mongodb-js/diagramming/-/diagramming-1.2.0.tgz", - "integrity": "sha512-U8tSC21RDtwWstoPPuW27I/ZOqieOoemTObpiz/mKnOZsGeos0GOT4Fph2sXwFQocaQUp5jkwLWzksf8ZOwLcA==", - "license": "MIT", - "dependencies": { - "@emotion/react": "^11.14.0", - "@emotion/styled": "^11.14.0", - "@leafygreen-ui/icon": "^13.2.0", - "@leafygreen-ui/leafygreen-provider": "^5.0.0", - "@leafygreen-ui/palette": "^5.0.0", - "@leafygreen-ui/tokens": "^3.0.0", - "@leafygreen-ui/typography": "^20.1.4", - "@xyflow/react": "^12.5.1", - "d3-path": "^3.1.0", - "elkjs": "^0.10.0", - "react": "17.0.2", - "react-dom": "17.0.2" - } - }, - "node_modules/@mongodb-js/diagramming/node_modules/@leafygreen-ui/emotion": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/emotion/-/emotion-5.0.0.tgz", - "integrity": "sha512-MOfouBCmHuFa6UObhUl03CUFqXvD2PP+nI7CLk0ny8/UKOLgAX4N+JuuSX606u+Efxk4lI2m3FZiyCrfi6oeFQ==", - "license": "Apache-2.0", - "dependencies": { - "@emotion/css": "^11.1.3", - "@emotion/server": "^11.4.0" - } - }, - "node_modules/@mongodb-js/diagramming/node_modules/@leafygreen-ui/hooks": { - "version": "9.1.0", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/hooks/-/hooks-9.1.0.tgz", - "integrity": "sha512-2hesC3HLL8mETJMgZJfNMYjVraTGP4FAikUa3qpI1yi155xQBVlqrLCDzLEXCiUT4+agUTMaf/VHeyM7LTfwfg==", - "license": "Apache-2.0", - "dependencies": { - "@leafygreen-ui/lib": "^15.1.0", - "@leafygreen-ui/tokens": "^3.1.1", - "lodash": "^4.17.21" - } - }, - "node_modules/@mongodb-js/diagramming/node_modules/@leafygreen-ui/leafygreen-provider": { - "version": "5.0.1", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/leafygreen-provider/-/leafygreen-provider-5.0.1.tgz", - "integrity": "sha512-fWAAwgs0SOt5T0yrPZTnLOwdygoPd6TLKwb8TOz5pTgJUY9tU4sKvKEhiIS9vsk5sz0Dr8dMs4lgD2bvuLe6/g==", - "license": "Apache-2.0", - "dependencies": { - "@leafygreen-ui/hooks": "^9.1.0", - "@leafygreen-ui/lib": "^15.1.0", - "react-transition-group": "^4.4.5" - } - }, - "node_modules/@mongodb-js/diagramming/node_modules/@leafygreen-ui/lib": { - "version": "15.1.0", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/lib/-/lib-15.1.0.tgz", - "integrity": "sha512-pUSPxbFz7/8zDFJc6E4DCeDijD7HGBEMuhqzpP7t9WJEgQU2U+cDLvvB6C7rasYZEjBK9Sx76MTrAxrdq2dxnQ==", - "license": "Apache-2.0", - "dependencies": { - "lodash": "^4.17.21" - }, - "peerDependencies": { - "react": "^17.0.0 || ^18.0.0" - } - }, - "node_modules/@mongodb-js/diagramming/node_modules/@leafygreen-ui/palette": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/palette/-/palette-5.0.0.tgz", - "integrity": "sha512-RHQy165X7lKMlNU+2BkvGCNuo8fP3bS5NVOJ6thSKingoksYrz1a6SNAzuHDIkww+njf0GaKiXYT64og2Xm4Fw==", - "license": "Apache-2.0" - }, - "node_modules/@mongodb-js/diagramming/node_modules/@leafygreen-ui/tokens": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/tokens/-/tokens-3.1.1.tgz", - "integrity": "sha512-2uSNd0vnUGTh/MqJuYu1A8evGC86vNtF2Ds4ksYBcwRCiZxfp5HA1DXS5SHmgiKpYnFusXKq2NzKGMhBsmwt7Q==", - "license": "Apache-2.0", - "dependencies": { - "@leafygreen-ui/emotion": "^5.0.0", - "@leafygreen-ui/lib": "^15.1.0", - "@leafygreen-ui/palette": "^5.0.0", - "polished": "^4.2.2" - } - }, "node_modules/@mongodb-js/dl-center": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/@mongodb-js/dl-center/-/dl-center-1.3.0.tgz", @@ -45131,7 +45049,7 @@ "@mongodb-js/compass-user-data": "^0.8.4", "@mongodb-js/compass-utils": "^0.9.9", "@mongodb-js/compass-workspaces": "^0.50.0", - "@mongodb-js/diagramming": "^1.2.0", + "@mongodb-js/diagramming": "^1.3.2", "bson": "^6.10.4", "compass-preferences-model": "^2.49.0", "html-to-image": "1.11.11", @@ -45166,6 +45084,112 @@ "xvfb-maybe": "^0.2.1" } }, + "packages/compass-data-modeling/node_modules/@leafygreen-ui/emotion": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/emotion/-/emotion-5.0.0.tgz", + "integrity": "sha512-MOfouBCmHuFa6UObhUl03CUFqXvD2PP+nI7CLk0ny8/UKOLgAX4N+JuuSX606u+Efxk4lI2m3FZiyCrfi6oeFQ==", + "license": "Apache-2.0", + "dependencies": { + "@emotion/css": "^11.1.3", + "@emotion/server": "^11.4.0" + } + }, + "packages/compass-data-modeling/node_modules/@leafygreen-ui/hooks": { + "version": "9.1.1", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/hooks/-/hooks-9.1.1.tgz", + "integrity": "sha512-WVAu5NgFo5eALb7Z2E8v2mEaUtiGXsOrOGX8fLHSU75Xs343SGWllwxqqGnhf+bbUNlSXBAbprHAD3/Yn4QcyQ==", + "license": "Apache-2.0", + "dependencies": { + "@leafygreen-ui/lib": "^15.2.0", + "@leafygreen-ui/tokens": "^3.1.2", + "lodash": "^4.17.21" + } + }, + "packages/compass-data-modeling/node_modules/@leafygreen-ui/hooks/node_modules/@leafygreen-ui/lib": { + "version": "15.2.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/lib/-/lib-15.2.0.tgz", + "integrity": "sha512-wrVJGaqACcYWE/xPHHJREpRvkoy4Biwim1SUuq0hs/lXf6cEMg7MD9x2fUDJ9v6tQmLiFuwRXbJiXrvVXkz4Lg==", + "license": "Apache-2.0", + "dependencies": { + "lodash": "^4.17.21" + }, + "peerDependencies": { + "react": "^17.0.0 || ^18.0.0" + } + }, + "packages/compass-data-modeling/node_modules/@leafygreen-ui/leafygreen-provider": { + "version": "5.0.2", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/leafygreen-provider/-/leafygreen-provider-5.0.2.tgz", + "integrity": "sha512-mLD7ziluM0ZoTlzoauu6AeA3vGVlf9JilUjmWZEcZeRfzJcIyF48PoL7Mj23AqY1k1PNcJHhlK9ALpIzpI33ug==", + "license": "Apache-2.0", + "dependencies": { + "@leafygreen-ui/hooks": "^9.1.1", + "@leafygreen-ui/lib": "^15.2.0", + "react-transition-group": "^4.4.5" + } + }, + "packages/compass-data-modeling/node_modules/@leafygreen-ui/leafygreen-provider/node_modules/@leafygreen-ui/lib": { + "version": "15.2.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/lib/-/lib-15.2.0.tgz", + "integrity": "sha512-wrVJGaqACcYWE/xPHHJREpRvkoy4Biwim1SUuq0hs/lXf6cEMg7MD9x2fUDJ9v6tQmLiFuwRXbJiXrvVXkz4Lg==", + "license": "Apache-2.0", + "dependencies": { + "lodash": "^4.17.21" + }, + "peerDependencies": { + "react": "^17.0.0 || ^18.0.0" + } + }, + "packages/compass-data-modeling/node_modules/@leafygreen-ui/palette": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/palette/-/palette-5.0.0.tgz", + "integrity": "sha512-RHQy165X7lKMlNU+2BkvGCNuo8fP3bS5NVOJ6thSKingoksYrz1a6SNAzuHDIkww+njf0GaKiXYT64og2Xm4Fw==", + "license": "Apache-2.0" + }, + "packages/compass-data-modeling/node_modules/@leafygreen-ui/tokens": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/tokens/-/tokens-3.2.1.tgz", + "integrity": "sha512-FJwgN9zRFa/1Lrw3teuBdTF+Fi/IAdpaNuUUEiVIissHK4Py8Dsc6HJhWKBOocBj5dEw78cRDgnqSVFvU6EjMg==", + "license": "Apache-2.0", + "dependencies": { + "@leafygreen-ui/emotion": "^5.0.0", + "@leafygreen-ui/lib": "^15.2.0", + "@leafygreen-ui/palette": "^5.0.0", + "polished": "^4.2.2" + } + }, + "packages/compass-data-modeling/node_modules/@leafygreen-ui/tokens/node_modules/@leafygreen-ui/lib": { + "version": "15.2.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/lib/-/lib-15.2.0.tgz", + "integrity": "sha512-wrVJGaqACcYWE/xPHHJREpRvkoy4Biwim1SUuq0hs/lXf6cEMg7MD9x2fUDJ9v6tQmLiFuwRXbJiXrvVXkz4Lg==", + "license": "Apache-2.0", + "dependencies": { + "lodash": "^4.17.21" + }, + "peerDependencies": { + "react": "^17.0.0 || ^18.0.0" + } + }, + "packages/compass-data-modeling/node_modules/@mongodb-js/diagramming": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/@mongodb-js/diagramming/-/diagramming-1.3.2.tgz", + "integrity": "sha512-fFBwsrSqu7J47ImxroHCcduTlLY6CzfaTBstRAZxQyodJvJGxzxZVdoEhlbZ8DPFLeL8y2xmMrAkF3hApnkuHA==", + "license": "MIT", + "dependencies": { + "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", + "@leafygreen-ui/icon": "^13.2.0", + "@leafygreen-ui/leafygreen-provider": "^5.0.0", + "@leafygreen-ui/palette": "^5.0.0", + "@leafygreen-ui/tokens": "^3.0.0", + "@leafygreen-ui/typography": "^20.1.4", + "@xyflow/react": "^12.5.1", + "d3-path": "^3.1.0", + "elkjs": "^0.10.0", + "react": "17.0.2", + "react-dom": "17.0.2" + } + }, "packages/compass-data-modeling/node_modules/@sinonjs/commons": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz", @@ -57526,7 +57550,7 @@ "@mongodb-js/compass-user-data": "^0.8.4", "@mongodb-js/compass-utils": "^0.9.9", "@mongodb-js/compass-workspaces": "^0.50.0", - "@mongodb-js/diagramming": "^1.2.0", + "@mongodb-js/diagramming": "^1.3.2", "@mongodb-js/eslint-config-compass": "^1.4.5", "@mongodb-js/mocha-config-compass": "^1.7.0", "@mongodb-js/prettier-config-compass": "^1.2.8", @@ -57559,6 +57583,100 @@ "xvfb-maybe": "^0.2.1" }, "dependencies": { + "@leafygreen-ui/emotion": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/emotion/-/emotion-5.0.0.tgz", + "integrity": "sha512-MOfouBCmHuFa6UObhUl03CUFqXvD2PP+nI7CLk0ny8/UKOLgAX4N+JuuSX606u+Efxk4lI2m3FZiyCrfi6oeFQ==", + "requires": { + "@emotion/css": "^11.1.3", + "@emotion/server": "^11.4.0" + } + }, + "@leafygreen-ui/hooks": { + "version": "9.1.1", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/hooks/-/hooks-9.1.1.tgz", + "integrity": "sha512-WVAu5NgFo5eALb7Z2E8v2mEaUtiGXsOrOGX8fLHSU75Xs343SGWllwxqqGnhf+bbUNlSXBAbprHAD3/Yn4QcyQ==", + "requires": { + "@leafygreen-ui/lib": "^15.2.0", + "@leafygreen-ui/tokens": "^3.1.2", + "lodash": "^4.17.21" + }, + "dependencies": { + "@leafygreen-ui/lib": { + "version": "15.2.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/lib/-/lib-15.2.0.tgz", + "integrity": "sha512-wrVJGaqACcYWE/xPHHJREpRvkoy4Biwim1SUuq0hs/lXf6cEMg7MD9x2fUDJ9v6tQmLiFuwRXbJiXrvVXkz4Lg==", + "requires": { + "lodash": "^4.17.21" + } + } + } + }, + "@leafygreen-ui/leafygreen-provider": { + "version": "5.0.2", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/leafygreen-provider/-/leafygreen-provider-5.0.2.tgz", + "integrity": "sha512-mLD7ziluM0ZoTlzoauu6AeA3vGVlf9JilUjmWZEcZeRfzJcIyF48PoL7Mj23AqY1k1PNcJHhlK9ALpIzpI33ug==", + "requires": { + "@leafygreen-ui/hooks": "^9.1.1", + "@leafygreen-ui/lib": "^15.2.0", + "react-transition-group": "^4.4.5" + }, + "dependencies": { + "@leafygreen-ui/lib": { + "version": "15.2.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/lib/-/lib-15.2.0.tgz", + "integrity": "sha512-wrVJGaqACcYWE/xPHHJREpRvkoy4Biwim1SUuq0hs/lXf6cEMg7MD9x2fUDJ9v6tQmLiFuwRXbJiXrvVXkz4Lg==", + "requires": { + "lodash": "^4.17.21" + } + } + } + }, + "@leafygreen-ui/palette": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/palette/-/palette-5.0.0.tgz", + "integrity": "sha512-RHQy165X7lKMlNU+2BkvGCNuo8fP3bS5NVOJ6thSKingoksYrz1a6SNAzuHDIkww+njf0GaKiXYT64og2Xm4Fw==" + }, + "@leafygreen-ui/tokens": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/tokens/-/tokens-3.2.1.tgz", + "integrity": "sha512-FJwgN9zRFa/1Lrw3teuBdTF+Fi/IAdpaNuUUEiVIissHK4Py8Dsc6HJhWKBOocBj5dEw78cRDgnqSVFvU6EjMg==", + "requires": { + "@leafygreen-ui/emotion": "^5.0.0", + "@leafygreen-ui/lib": "^15.2.0", + "@leafygreen-ui/palette": "^5.0.0", + "polished": "^4.2.2" + }, + "dependencies": { + "@leafygreen-ui/lib": { + "version": "15.2.0", + "resolved": "https://registry.npmjs.org/@leafygreen-ui/lib/-/lib-15.2.0.tgz", + "integrity": "sha512-wrVJGaqACcYWE/xPHHJREpRvkoy4Biwim1SUuq0hs/lXf6cEMg7MD9x2fUDJ9v6tQmLiFuwRXbJiXrvVXkz4Lg==", + "requires": { + "lodash": "^4.17.21" + } + } + } + }, + "@mongodb-js/diagramming": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/@mongodb-js/diagramming/-/diagramming-1.3.2.tgz", + "integrity": "sha512-fFBwsrSqu7J47ImxroHCcduTlLY6CzfaTBstRAZxQyodJvJGxzxZVdoEhlbZ8DPFLeL8y2xmMrAkF3hApnkuHA==", + "requires": { + "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", + "@leafygreen-ui/icon": "^13.2.0", + "@leafygreen-ui/leafygreen-provider": "^5.0.0", + "@leafygreen-ui/palette": "^5.0.0", + "@leafygreen-ui/tokens": "^3.0.0", + "@leafygreen-ui/typography": "^20.1.4", + "@xyflow/react": "^12.5.1", + "d3-path": "^3.1.0", + "elkjs": "^0.10.0", + "react": "17.0.2", + "react-dom": "17.0.2" + } + }, "@sinonjs/commons": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz", @@ -60492,80 +60610,6 @@ } } }, - "@mongodb-js/diagramming": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/@mongodb-js/diagramming/-/diagramming-1.2.0.tgz", - "integrity": "sha512-U8tSC21RDtwWstoPPuW27I/ZOqieOoemTObpiz/mKnOZsGeos0GOT4Fph2sXwFQocaQUp5jkwLWzksf8ZOwLcA==", - "requires": { - "@emotion/react": "^11.14.0", - "@emotion/styled": "^11.14.0", - "@leafygreen-ui/icon": "^13.2.0", - "@leafygreen-ui/leafygreen-provider": "^5.0.0", - "@leafygreen-ui/palette": "^5.0.0", - "@leafygreen-ui/tokens": "^3.0.0", - "@leafygreen-ui/typography": "^20.1.4", - "@xyflow/react": "^12.5.1", - "d3-path": "^3.1.0", - "elkjs": "^0.10.0", - "react": "^17.0.2", - "react-dom": "^17.0.2" - }, - "dependencies": { - "@leafygreen-ui/emotion": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/emotion/-/emotion-5.0.0.tgz", - "integrity": "sha512-MOfouBCmHuFa6UObhUl03CUFqXvD2PP+nI7CLk0ny8/UKOLgAX4N+JuuSX606u+Efxk4lI2m3FZiyCrfi6oeFQ==", - "requires": { - "@emotion/css": "^11.1.3", - "@emotion/server": "^11.4.0" - } - }, - "@leafygreen-ui/hooks": { - "version": "9.1.0", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/hooks/-/hooks-9.1.0.tgz", - "integrity": "sha512-2hesC3HLL8mETJMgZJfNMYjVraTGP4FAikUa3qpI1yi155xQBVlqrLCDzLEXCiUT4+agUTMaf/VHeyM7LTfwfg==", - "requires": { - "@leafygreen-ui/lib": "^15.1.0", - "@leafygreen-ui/tokens": "^3.1.1", - "lodash": "^4.17.21" - } - }, - "@leafygreen-ui/leafygreen-provider": { - "version": "5.0.1", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/leafygreen-provider/-/leafygreen-provider-5.0.1.tgz", - "integrity": "sha512-fWAAwgs0SOt5T0yrPZTnLOwdygoPd6TLKwb8TOz5pTgJUY9tU4sKvKEhiIS9vsk5sz0Dr8dMs4lgD2bvuLe6/g==", - "requires": { - "@leafygreen-ui/hooks": "^9.1.0", - "@leafygreen-ui/lib": "^15.1.0", - "react-transition-group": "^4.4.5" - } - }, - "@leafygreen-ui/lib": { - "version": "15.1.0", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/lib/-/lib-15.1.0.tgz", - "integrity": "sha512-pUSPxbFz7/8zDFJc6E4DCeDijD7HGBEMuhqzpP7t9WJEgQU2U+cDLvvB6C7rasYZEjBK9Sx76MTrAxrdq2dxnQ==", - "requires": { - "lodash": "^4.17.21" - } - }, - "@leafygreen-ui/palette": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/palette/-/palette-5.0.0.tgz", - "integrity": "sha512-RHQy165X7lKMlNU+2BkvGCNuo8fP3bS5NVOJ6thSKingoksYrz1a6SNAzuHDIkww+njf0GaKiXYT64og2Xm4Fw==" - }, - "@leafygreen-ui/tokens": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/@leafygreen-ui/tokens/-/tokens-3.1.1.tgz", - "integrity": "sha512-2uSNd0vnUGTh/MqJuYu1A8evGC86vNtF2Ds4ksYBcwRCiZxfp5HA1DXS5SHmgiKpYnFusXKq2NzKGMhBsmwt7Q==", - "requires": { - "@leafygreen-ui/emotion": "^5.0.0", - "@leafygreen-ui/lib": "^15.1.0", - "@leafygreen-ui/palette": "^5.0.0", - "polished": "^4.2.2" - } - } - } - }, "@mongodb-js/dl-center": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/@mongodb-js/dl-center/-/dl-center-1.3.0.tgz", diff --git a/packages/compass-data-modeling/package.json b/packages/compass-data-modeling/package.json index 2fefc7f9892..bdd19babfeb 100644 --- a/packages/compass-data-modeling/package.json +++ b/packages/compass-data-modeling/package.json @@ -63,7 +63,7 @@ "@mongodb-js/compass-user-data": "^0.8.4", "@mongodb-js/compass-utils": "^0.9.9", "@mongodb-js/compass-workspaces": "^0.50.0", - "@mongodb-js/diagramming": "^1.2.0", + "@mongodb-js/diagramming": "^1.3.2", "bson": "^6.10.4", "compass-preferences-model": "^2.49.0", "html-to-image": "1.11.11", diff --git a/packages/compass-data-modeling/src/components/diagram-editor.tsx b/packages/compass-data-modeling/src/components/diagram-editor.tsx index fb68e312c7b..985772c892d 100644 --- a/packages/compass-data-modeling/src/components/diagram-editor.tsx +++ b/packages/compass-data-modeling/src/components/diagram-editor.tsx @@ -98,6 +98,10 @@ const modelPreviewStyles = css({ ['.connectablestart']: { userSelect: 'none', }, + + ['*']: { + boxSizing: 'content-box', + }, }); type SelectedItems = NonNullable['selectedItems'];