From 2b98b490dc3886bf4cbc988ecbcaaa443e6cf805 Mon Sep 17 00:00:00 2001 From: Faris Demirovic Date: Sun, 17 Nov 2024 20:13:10 +0100 Subject: [PATCH] Attempt to fix build process --- editor/package-lock.json | 137 ------------------ editor/package.json | 1 - editor/src/App.tsx | 13 +- .../ApollonEditorComponent.tsx | 10 +- editor/src/index.css | 15 ++ package-lock.json | 3 +- package.json | 2 +- 7 files changed, 20 insertions(+), 161 deletions(-) diff --git a/editor/package-lock.json b/editor/package-lock.json index a8d653c..004721e 100644 --- a/editor/package-lock.json +++ b/editor/package-lock.json @@ -22,7 +22,6 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "5.0.1", - "styled-components": "6.1.8", "typescript": "^4.9.5", "uuid": "^10.0.0", "web-vitals": "^2.1.4", @@ -2418,27 +2417,6 @@ "postcss-selector-parser": "^6.0.10" } }, - "node_modules/@emotion/is-prop-valid": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz", - "integrity": "sha512-61Mf7Ufx4aDxx1xlDeOm8aFFigGHE4z+0sKCa+IHCeZKiyP9RLD0Mmx7m8b9/Cf37f7NAvQOOJAbQQGVr5uERw==", - "license": "MIT", - "dependencies": { - "@emotion/memoize": "^0.8.1" - } - }, - "node_modules/@emotion/memoize": { - "version": "0.8.1", - "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz", - "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==", - "license": "MIT" - }, - "node_modules/@emotion/unitless": { - "version": "0.8.0", - "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.0.tgz", - "integrity": "sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw==", - "license": "MIT" - }, "node_modules/@eslint-community/eslint-utils": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz", @@ -5718,12 +5696,6 @@ "integrity": "sha512-9aEbYZ3TbYMznPdcdr3SmIrLXwC/AKZXQeCf9Pgao5CKb8CyHuEX5jzWPTkvregvhRJHcpRO6BFoGW9ycaOkYw==", "license": "MIT" }, - "node_modules/@types/stylis": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.0.tgz", - "integrity": "sha512-n4sx2bqL0mW1tvDf/loQ+aMX7GQD3lc3fkCMC55VFNDu/vBOabO+LTIeXKM14xK0ppk5TUGcWRjiSpIlUpghKw==", - "license": "MIT" - }, "node_modules/@types/testing-library__jest-dom": { "version": "5.14.9", "resolved": "https://registry.npmjs.org/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.14.9.tgz", @@ -7299,15 +7271,6 @@ "node": ">= 6" } }, - "node_modules/camelize": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.1.tgz", - "integrity": "sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==", - "license": "MIT", - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/caniuse-api": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-3.0.0.tgz", @@ -7851,15 +7814,6 @@ "postcss": "^8.4" } }, - "node_modules/css-color-keywords": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz", - "integrity": "sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==", - "license": "ISC", - "engines": { - "node": ">=4" - } - }, "node_modules/css-declaration-sorter": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/css-declaration-sorter/-/css-declaration-sorter-7.2.0.tgz", @@ -8617,17 +8571,6 @@ "integrity": "sha512-jQVeeRG70QI08vSTwf1jHxp74JoZsr2XSgETae8/xC8ovSnL2WF87GTLO86Sbwdt2lK4Umg4HnnwMO4YF3Ce7w==", "license": "MIT" }, - "node_modules/css-to-react-native": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.2.0.tgz", - "integrity": "sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==", - "license": "MIT", - "dependencies": { - "camelize": "^1.0.0", - "css-color-keywords": "^1.0.0", - "postcss-value-parser": "^4.0.2" - } - }, "node_modules/css-tree": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz", @@ -17899,12 +17842,6 @@ "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==", "license": "ISC" }, - "node_modules/shallowequal": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz", - "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==", - "license": "MIT" - }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -18526,74 +18463,6 @@ "webpack": "^5.0.0" } }, - "node_modules/styled-components": { - "version": "6.1.8", - "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-6.1.8.tgz", - "integrity": "sha512-PQ6Dn+QxlWyEGCKDS71NGsXoVLKfE1c3vApkvDYS5KAK+V8fNWGhbSUEo9Gg2iaID2tjLXegEW3bZDUGpofRWw==", - "license": "MIT", - "dependencies": { - "@emotion/is-prop-valid": "1.2.1", - "@emotion/unitless": "0.8.0", - "@types/stylis": "4.2.0", - "css-to-react-native": "3.2.0", - "csstype": "3.1.2", - "postcss": "8.4.31", - "shallowequal": "1.1.0", - "stylis": "4.3.1", - "tslib": "2.5.0" - }, - "engines": { - "node": ">= 16" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/styled-components" - }, - "peerDependencies": { - "react": ">= 16.8.0", - "react-dom": ">= 16.8.0" - } - }, - "node_modules/styled-components/node_modules/csstype": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", - "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==", - "license": "MIT" - }, - "node_modules/styled-components/node_modules/postcss": { - "version": "8.4.31", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", - "integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==", - "funding": [ - { - "type": "opencollective", - "url": "https://opencollective.com/postcss/" - }, - { - "type": "tidelift", - "url": "https://tidelift.com/funding/github/npm/postcss" - }, - { - "type": "github", - "url": "https://github.com/sponsors/ai" - } - ], - "license": "MIT", - "dependencies": { - "nanoid": "^3.3.6", - "picocolors": "^1.0.0", - "source-map-js": "^1.0.2" - }, - "engines": { - "node": "^10 || ^12 || >=14" - } - }, - "node_modules/styled-components/node_modules/tslib": { - "version": "2.5.0", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", - "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", - "license": "0BSD" - }, "node_modules/stylehacks": { "version": "7.0.4", "resolved": "https://registry.npmjs.org/stylehacks/-/stylehacks-7.0.4.tgz", @@ -18613,12 +18482,6 @@ "postcss": "^8.4.31" } }, - "node_modules/stylis": { - "version": "4.3.1", - "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.3.1.tgz", - "integrity": "sha512-EQepAV+wMsIaGVGX1RECzgrcqRRU/0sYOHkeLsZ3fzHaHXZy4DaOOX0vOlGQdlsjkh3mFHAIlVimpwAs4dslyQ==", - "license": "MIT" - }, "node_modules/sucrase": { "version": "3.35.0", "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz", diff --git a/editor/package.json b/editor/package.json index 93ab3c7..5c54b2a 100644 --- a/editor/package.json +++ b/editor/package.json @@ -17,7 +17,6 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "5.0.1", - "styled-components": "6.1.8", "typescript": "^4.9.5", "uuid": "^10.0.0", "web-vitals": "^2.1.4", diff --git a/editor/src/App.tsx b/editor/src/App.tsx index 8cbc32c..50f343c 100644 --- a/editor/src/App.tsx +++ b/editor/src/App.tsx @@ -1,20 +1,11 @@ import { useState } from "react"; import { ApollonEditor } from "@ls1intum/apollon"; import { VSCodeButton } from "@vscode/webview-ui-toolkit/react"; -import styled from "styled-components"; import { ApollonEditorProvider } from "./components/apollon-editor-component/ApollonEditorContext"; import { ApollonEditorComponent } from "./components/apollon-editor-component/ApollonEditorComponent"; import { vscode } from "./index"; import useStore from "./store"; -const AppBar = styled.div` - width: 100%; - background: var(--vscode-activityBar-background); - padding: 1rem 0; - display: flex; - justify-content: flex-start; -`; - function App() { const [editor, setEditor] = useState(); const handleSetEditor = (newEditor: ApollonEditor) => { @@ -41,14 +32,14 @@ function App() { return ( <> - +
Save Export as SVG - +
diff --git a/editor/src/components/apollon-editor-component/ApollonEditorComponent.tsx b/editor/src/components/apollon-editor-component/ApollonEditorComponent.tsx index fe15299..15f662b 100644 --- a/editor/src/components/apollon-editor-component/ApollonEditorComponent.tsx +++ b/editor/src/components/apollon-editor-component/ApollonEditorComponent.tsx @@ -1,17 +1,9 @@ import { ApollonEditor, UMLModel } from "@ls1intum/apollon"; import React, { useEffect, useRef, useContext } from "react"; -import styled from "styled-components"; import { ApollonEditorContext } from "./ApollonEditorContext"; import useStore from "../../store"; -const ApollonContainer = styled.div` - display: flex; - flex-direction: column; - overflow: hidden; - background-color: var(--apollon-background); -`; - export const ApollonEditorComponent: React.FC = () => { const containerRef = useRef(null); const editorRef = useRef(null); @@ -51,5 +43,5 @@ export const ApollonEditorComponent: React.FC = () => { initializeEditor(); }, [createNewEditor]); - return ; + return
; }; diff --git a/editor/src/index.css b/editor/src/index.css index f3fc02a..aa6366b 100644 --- a/editor/src/index.css +++ b/editor/src/index.css @@ -22,3 +22,18 @@ body { line-height: normal; margin-bottom: 3px; } + +.apollon-container { + display: flex; + flex-direction: column; + overflow: hidden; + background-color: var(--apollon-background); +} + +.app-bar { + width: 100%; + background: var(--vscode-activityBar-background); + padding: 1rem 0; + display: flex; + justify-content: flex-start; +} diff --git a/package-lock.json b/package-lock.json index ccc1cb8..df8fabf 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,13 +9,13 @@ "version": "1.0.0", "dependencies": { "@ls1intum/apollon": "^3.3.15", + "@types/styled-components": "^5.1.34", "@vscode/vsce": "^3.2.1", "uuid": "^11.0.2" }, "devDependencies": { "@types/mocha": "^10.0.6", "@types/node": "18.x", - "@types/styled-components": "^5.1.34", "@types/vscode": "^1.86.0", "@typescript-eslint/eslint-plugin": "^7.0.2", "@typescript-eslint/parser": "^7.0.2", @@ -1092,7 +1092,6 @@ "version": "5.1.34", "resolved": "https://registry.npmjs.org/@types/styled-components/-/styled-components-5.1.34.tgz", "integrity": "sha512-mmiVvwpYklFIv9E8qfxuPyIt/OuyIrn6gMOAMOFUO3WJfSrSE+sGUoa4PiZj77Ut7bKZpaa6o1fBKS/4TOEvnA==", - "dev": true, "license": "MIT", "dependencies": { "@types/hoist-non-react-statics": "*", diff --git a/package.json b/package.json index 10d929f..84b2981 100644 --- a/package.json +++ b/package.json @@ -65,7 +65,6 @@ "devDependencies": { "@types/mocha": "^10.0.6", "@types/node": "18.x", - "@types/styled-components": "^5.1.34", "@types/vscode": "^1.86.0", "@typescript-eslint/eslint-plugin": "^7.0.2", "@typescript-eslint/parser": "^7.0.2", @@ -76,6 +75,7 @@ }, "dependencies": { "@ls1intum/apollon": "^3.3.15", + "@types/styled-components": "^5.1.34", "@vscode/vsce": "^3.2.1", "uuid": "^11.0.2" },