From d022991b077919abaa9ace7df9b92aaa3d6e5ec9 Mon Sep 17 00:00:00 2001 From: Saul-Mirone Date: Fri, 15 Apr 2022 20:51:58 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20slash=20plugin=20position?= =?UTF-8?q?=20error=20when=20editor=20size=20is=20small?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- examples/react/package.json | 8 +- examples/vanilla/main.ts | 2 + examples/vanilla/package.json | 3 +- gh-pages/style.css | 13 +- .../plugin-slash/src/prose-plugin/view.ts | 5 +- packages/theme-nord/src/style.ts | 5 - packages/theme-tokyo/src/style.ts | 5 - pnpm-lock.yaml | 131 +++++++----------- 8 files changed, 70 insertions(+), 102 deletions(-) diff --git a/examples/react/package.json b/examples/react/package.json index 2c50a22130b..5fdb0a2c035 100644 --- a/examples/react/package.json +++ b/examples/react/package.json @@ -7,10 +7,10 @@ "start": "vite" }, "dependencies": { - "react": "^17.0.2", - "react-dom": "^17.0.2", - "@types/react": "^17.0.6", - "@types/react-dom": "^17.0.5", + "react": "^18.0.0", + "react-dom": "^18.0.0", + "@types/react": "^18.0.0", + "@types/react-dom": "^18.0.0", "@milkdown/core": "workspace:*", "@milkdown/preset-commonmark": "workspace:*", "@milkdown/plugin-tooltip": "workspace:*", diff --git a/examples/vanilla/main.ts b/examples/vanilla/main.ts index 6bcd6ce0e39..d4377fd5037 100644 --- a/examples/vanilla/main.ts +++ b/examples/vanilla/main.ts @@ -3,6 +3,7 @@ import './style.css'; import { defaultValueCtx, Editor, themeManagerCtx } from '@milkdown/core'; import { math } from '@milkdown/plugin-math'; +import { slash } from '@milkdown/plugin-slash'; import { commonmark } from '@milkdown/preset-commonmark'; import { nord } from '@milkdown/theme-nord'; import { tokyo } from '@milkdown/theme-tokyo'; @@ -20,6 +21,7 @@ async function main() { .use(tokyo) .use(commonmark) .use(math) + .use(slash()) .create(); await sleep(2000); diff --git a/examples/vanilla/package.json b/examples/vanilla/package.json index 7143a2b7c0a..658de73114e 100644 --- a/examples/vanilla/package.json +++ b/examples/vanilla/package.json @@ -11,6 +11,7 @@ "@milkdown/preset-commonmark": "workspace:*", "@milkdown/theme-nord": "workspace:*", "@milkdown/theme-tokyo": "workspace:*", - "@milkdown/plugin-math": "workspace:*" + "@milkdown/plugin-math": "workspace:*", + "@milkdown/plugin-slash": "workspace:*" } } diff --git a/gh-pages/style.css b/gh-pages/style.css index c5d16c52cc3..fc80a4c842c 100644 --- a/gh-pages/style.css +++ b/gh-pages/style.css @@ -54,6 +54,13 @@ body { width: 100%; } transition: all 0.4s ease-in-out; + + .editor { + @media only screen and (min-width: 72rem) { + max-width: 57.375em; + padding: 3.125em 7.25em !important; + } + } } .loading { @@ -67,8 +74,10 @@ body { max-width: 72rem !important; .milkdown { - overflow: auto; - height: calc(100vh - 11.5rem - 20px); + .editor { + overflow: auto; + height: calc(100vh - 11.5rem - 110px); + } } position: relative; diff --git a/packages/plugin-slash/src/prose-plugin/view.ts b/packages/plugin-slash/src/prose-plugin/view.ts index 4250be96907..f9f4ad61bcb 100644 --- a/packages/plugin-slash/src/prose-plugin/view.ts +++ b/packages/plugin-slash/src/prose-plugin/view.ts @@ -29,7 +29,10 @@ const calculatePosition = (view: EditorView, dropdownElement: HTMLElement) => { } if (parent.height + parent.top - selected.bottom < target.height) { - top = selected.top - parent.top - target.height - 14 + $editor.scrollTop; + const topOffset = selected.top - parent.top - target.height - 14 + $editor.scrollTop; + if (topOffset > 0) { + top = topOffset; + } } return [top, left]; }); diff --git a/packages/theme-nord/src/style.ts b/packages/theme-nord/src/style.ts index 084144e1a28..43483a70370 100644 --- a/packages/theme-nord/src/style.ts +++ b/packages/theme-nord/src/style.ts @@ -38,11 +38,6 @@ export const getStyle = (manager: ThemeManager, emotion: Emotion) => { & > * { margin: 1.875em 0; } - - @media only screen and (min-width: 72rem) { - max-width: 57.375em; - padding: 3.125em 7.25em; - } `; const paragraph = css` diff --git a/packages/theme-tokyo/src/style.ts b/packages/theme-tokyo/src/style.ts index 500ff07ac86..e9a72918ea8 100644 --- a/packages/theme-tokyo/src/style.ts +++ b/packages/theme-tokyo/src/style.ts @@ -38,11 +38,6 @@ export const getStyle = (manager: ThemeManager, emotion: Emotion) => { & > * { margin: 1.875em 0; } - - @media only screen and (min-width: 72rem) { - max-width: 57.375em; - padding: 3.125em 7.25em; - } `; const paragraph = css` diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 215cc60be88..8a8441aaa0d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -48,10 +48,10 @@ importers: '@changesets/cli': 2.21.0 '@commitlint/cli': 16.2.1 '@commitlint/config-conventional': 16.2.1 - '@nrwl/cli': 13.10.1 - '@nrwl/nx-cloud': 13.2.2 - '@nrwl/tao': 13.10.1 - '@nrwl/workspace': 13.10.1_72d6b8519420775fc672e98e7f71dca3 + '@nrwl/cli': 13.10.2 + '@nrwl/nx-cloud': 13.3.1 + '@nrwl/tao': 13.10.2 + '@nrwl/workspace': 13.10.2_72d6b8519420775fc672e98e7f71dca3 '@rollup/plugin-typescript': 8.3.0_514f40b4e4a5f6d44e0ffe79fb11edce '@types/node': 17.0.18 '@types/rollup-plugin-auto-external': 2.0.2 @@ -75,7 +75,7 @@ importers: husky: 7.0.4 jsdom: 19.0.0 lint-staged: 12.3.4 - nx: 13.10.1 + nx: 13.10.2 prettier: 2.5.1 rimraf: 3.0.2 rollup: 2.67.3 @@ -138,31 +138,33 @@ importers: '@milkdown/preset-commonmark': workspace:* '@milkdown/react': workspace:* '@milkdown/theme-nord': workspace:* - '@types/react': ^17.0.6 - '@types/react-dom': ^17.0.5 - react: ^17.0.2 - react-dom: ^17.0.2 + '@types/react': ^18.0.0 + '@types/react-dom': ^18.0.0 + react: ^18.0.0 + react-dom: ^18.0.0 dependencies: '@milkdown/core': link:../../packages/core '@milkdown/plugin-tooltip': link:../../packages/plugin-tooltip '@milkdown/preset-commonmark': link:../../packages/preset-commonmark '@milkdown/react': link:../../packages/react '@milkdown/theme-nord': link:../../packages/theme-nord - '@types/react': 17.0.39 - '@types/react-dom': 17.0.13 - react: 17.0.2 - react-dom: 17.0.2_react@17.0.2 + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + react: 18.0.0 + react-dom: 18.0.0_react@18.0.0 examples/vanilla: specifiers: '@milkdown/core': workspace:* '@milkdown/plugin-math': workspace:* + '@milkdown/plugin-slash': workspace:* '@milkdown/preset-commonmark': workspace:* '@milkdown/theme-nord': workspace:* '@milkdown/theme-tokyo': workspace:* dependencies: '@milkdown/core': link:../../packages/core '@milkdown/plugin-math': link:../../packages/plugin-math + '@milkdown/plugin-slash': link:../../packages/plugin-slash '@milkdown/preset-commonmark': link:../../packages/preset-commonmark '@milkdown/theme-nord': link:../../packages/theme-nord '@milkdown/theme-tokyo': link:../../packages/theme-tokyo @@ -2479,20 +2481,20 @@ packages: fastq: 1.13.0 dev: true - /@nrwl/cli/13.10.1: - resolution: {integrity: sha512-qpjnx7bobwurUOCZG7DIZGfRNfyaxovSIFWacWRv0Pe60ZRGZw76PRmhTyRj5/U5qnvdKhlPIWy4hxeusJTHLw==} + /@nrwl/cli/13.10.2: + resolution: {integrity: sha512-e9TK7CBaOb2jvnnuypPTox+l3vr1Lubjrq7rvyVrUDfSFsRe33Em1FTEdT7RCwjzF1ypvGkF0Fm2Cxi9/ljxVg==} dependencies: - nx: 13.10.1 + nx: 13.10.2 transitivePeerDependencies: - supports-color dev: true - /@nrwl/devkit/13.10.1: - resolution: {integrity: sha512-2gzrVfnYH+0ZmM9gDI9kl0qSf0NnzBUDsy0D6uDmvUrwP7jh8Q48d+aFN28E73wTpO91qzzNXUc66iC9Sr9ozQ==} + /@nrwl/devkit/13.10.2: + resolution: {integrity: sha512-7jM86MAHc/vvQ4jJt8QjMncC0lFfhkxZ/d5Nt5b+s3AUQgFPkwg1TXt/uj+qo0goS/Mbv5UNVIdMGlEchnbvVQ==} dependencies: ejs: 3.1.6 ignore: 5.2.0 - nx: 13.10.1 + nx: 13.10.2 rxjs: 6.6.7 semver: 7.3.4 tslib: 2.3.1 @@ -2500,12 +2502,12 @@ packages: - supports-color dev: true - /@nrwl/jest/13.10.1: - resolution: {integrity: sha512-Nglpc+EOYadTIOmN5JuXuFbo8rUkjcdQmjs+grkIHgAOnGTrvdrGoKnwfSTd3rk/EJLZuLXamVt2K5K+pks/7Q==} + /@nrwl/jest/13.10.2: + resolution: {integrity: sha512-Zgila3j9z8RqivYUXJRqMKY3EhHgTRxG0Qq6s9a8yMQFvTi1ilQ7NiZe7qL6sTSlB02wavlP0IreT41pth7SZw==} dependencies: '@jest/reporters': 27.2.2 '@jest/test-result': 27.2.2 - '@nrwl/devkit': 13.10.1 + '@nrwl/devkit': 13.10.2 chalk: 4.1.0 identity-obj-proxy: 3.0.0 jest-config: 27.2.2 @@ -2523,16 +2525,16 @@ packages: - utf-8-validate dev: true - /@nrwl/linter/13.10.1_eslint@8.9.0+typescript@4.6.2: - resolution: {integrity: sha512-Zp46DV4lL9hE3XQbLH+PzmCLRuu2KbPL9/JeOKSUNrKVjW49kdorKaLwzwD3zmmpyBKCGEJcnWTJcwBzUOY8uQ==} + /@nrwl/linter/13.10.2_eslint@8.9.0+typescript@4.6.2: + resolution: {integrity: sha512-XMSvyeInCH+sUI1VxyVH5JqXwKJNdnI8RbHYTGDGIVsHrIR/OMQ2dKkCNCJThoIs8N1oWJ238999g8srnXQneA==} peerDependencies: eslint: ^8.0.0 peerDependenciesMeta: eslint: optional: true dependencies: - '@nrwl/devkit': 13.10.1 - '@nrwl/jest': 13.10.1 + '@nrwl/devkit': 13.10.2 + '@nrwl/jest': 13.10.2 '@phenomnomnominal/tsquery': 4.1.1_typescript@4.6.2 eslint: 8.9.0 tmp: 0.2.1 @@ -2547,10 +2549,11 @@ packages: - utf-8-validate dev: true - /@nrwl/nx-cloud/13.2.2: - resolution: {integrity: sha512-ryGE3JBkSGie0Oy+hFHfiYVNt1BQlNGa3Q7RjeZjILFyNFXkSFzufWYCt1gIRiGlQ7+Q48t1m6gLi2afElNGmg==} + /@nrwl/nx-cloud/13.3.1: + resolution: {integrity: sha512-txVZuDQE7KkpTLNVh4Rr7zWeCudqFt/nJEahaRIudm8uc6HoM41O63976zKG1xEtBbblBQpUBIdmOwSsSRBVbg==} hasBin: true dependencies: + '@nrwl/devkit': 13.10.2 axios: 0.21.4 chalk: 4.1.0 node-machine-id: 1.1.12 @@ -2558,28 +2561,29 @@ packages: tar: 6.1.11 transitivePeerDependencies: - debug + - supports-color dev: true - /@nrwl/tao/13.10.1: - resolution: {integrity: sha512-QYtMISnJPYyA9ADfBTXiEWvwzjgMICGIrM6sWc018dI2pQ8rWiTRRGOKq5YOsyHGhVd+MSEQYJlElGl3Y4gDIA==} + /@nrwl/tao/13.10.2: + resolution: {integrity: sha512-Eq/u4tRRRtrMYBormdeTrRFj/rpcP5fsa3QrwcHjUSNnQDM/FZ9kt7fRgbnh+2QzdTJnU4QmaX6t4Kt+qYtsTQ==} hasBin: true dependencies: - nx: 13.10.1 + nx: 13.10.2 transitivePeerDependencies: - supports-color dev: true - /@nrwl/workspace/13.10.1_72d6b8519420775fc672e98e7f71dca3: - resolution: {integrity: sha512-I3ODcyTlZLt0f0wTrw2mgxoKEYMnCd2PQM9zkMpSLIjgN0QBQ6uVmuvVXxqlWkjgtGXd/IUKubFQ5wfcV9AdQA==} + /@nrwl/workspace/13.10.2_72d6b8519420775fc672e98e7f71dca3: + resolution: {integrity: sha512-ribTuHpBdkwiW0S8tZXEw/v/IQqPH18TfM6/CzD1ew3NyOS22OnGZfeHjdBCHGHtzqgpEsoROnXmuXoBhm9NUw==} peerDependencies: prettier: ^2.5.1 peerDependenciesMeta: prettier: optional: true dependencies: - '@nrwl/devkit': 13.10.1 - '@nrwl/jest': 13.10.1 - '@nrwl/linter': 13.10.1_eslint@8.9.0+typescript@4.6.2 + '@nrwl/devkit': 13.10.2 + '@nrwl/jest': 13.10.2 + '@nrwl/linter': 13.10.2_eslint@8.9.0+typescript@4.6.2 '@parcel/watcher': 2.0.4 chalk: 4.1.0 chokidar: 3.5.3 @@ -2594,7 +2598,7 @@ packages: ignore: 5.2.0 minimatch: 3.0.4 npm-run-path: 4.0.1 - nx: 13.10.1 + nx: 13.10.2 open: 8.4.0 prettier: 2.5.1 rxjs: 6.6.7 @@ -3156,17 +3160,10 @@ packages: '@types/prosemirror-state': 1.2.8 '@types/prosemirror-transform': 1.1.5 - /@types/react-dom/17.0.13: - resolution: {integrity: sha512-wEP+B8hzvy6ORDv1QBhcQia4j6ea4SFIBttHYpXKPFZRviBvknq0FRh3VrIxeXUmsPkwuXVZrVGG7KUVONmXCQ==} - dependencies: - '@types/react': 17.0.39 - dev: false - /@types/react-dom/18.0.0: resolution: {integrity: sha512-49897Y0UiCGmxZqpC8Blrf6meL8QUla6eb+BBhn69dTXlmuOlzkfr7HHY/O8J25e1lTUMs+YYxSlVDAaGHCOLg==} dependencies: '@types/react': 18.0.0 - dev: true /@types/react-router-dom/5.3.3: resolution: {integrity: sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==} @@ -3183,21 +3180,12 @@ packages: '@types/react': 18.0.0 dev: true - /@types/react/17.0.39: - resolution: {integrity: sha512-UVavlfAxDd/AgAacMa60Azl7ygyQNRwC/DsHZmKgNvPmRR5p70AJ5Q9EAmL2NWOJmeV+vVUI4IAP7GZrN8h8Ug==} - dependencies: - '@types/prop-types': 15.7.4 - '@types/scheduler': 0.16.2 - csstype: 3.0.10 - dev: false - /@types/react/18.0.0: resolution: {integrity: sha512-7+K7zEQYu7NzOwQGLR91KwWXXDzmTFODRVizJyIALf6RfLv2GDpqpknX64pvRVILXCpXi7O/pua8NGk44dLvJw==} dependencies: '@types/prop-types': 15.7.4 '@types/scheduler': 0.16.2 csstype: 3.0.10 - dev: true /@types/refractor/3.0.2: resolution: {integrity: sha512-2HMXuwGuOqzUG+KUTm9GDJCHl0LCBKsB5cg28ujEmVi/0qgTb6jOmkVSO5K48qXksyl2Fr3C0Q2VrgD4zbwyXg==} @@ -9154,13 +9142,13 @@ packages: resolution: {integrity: sha512-h2AatdwYH+JHiZpv7pt/gSX1XoRGb7L/qSIeuqA6GwYoF9w1vP1cw42TO0aI2pNyshRK5893hNSl+1//vHK7hQ==} dev: true - /nx/13.10.1: - resolution: {integrity: sha512-XA1sN8biNhUJcKqjUMsvbC8QzIF631CJvDxZ1n48R1QsB8LJG/pvHY2pIqz6GWRJFbR9mhwAqYyoHq43qCSyYw==} + /nx/13.10.2: + resolution: {integrity: sha512-6ac/7DO66asndgsMVC+YR5oa0jfEmmXjmE19gvIuAJtii00dSKd6o+n1G8lbl8RPZcz43wVY0zwV/eMpCSNFXw==} hasBin: true requiresBuild: true dependencies: - '@nrwl/cli': 13.10.1 - '@nrwl/tao': 13.10.1 + '@nrwl/cli': 13.10.2 + '@nrwl/tao': 13.10.2 '@parcel/watcher': 2.0.4 '@swc-node/register': 1.4.2 '@swc/core': 1.2.154 @@ -9197,6 +9185,7 @@ packages: /object-assign/4.1.1: resolution: {integrity: sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=} engines: {node: '>=0.10.0'} + dev: true /object-inspect/1.12.0: resolution: {integrity: sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g==} @@ -9969,21 +9958,10 @@ packages: react: 18.0.0 dev: true - /react-dom/17.0.2_react@17.0.2: - resolution: {integrity: sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==} - peerDependencies: - react: 17.0.2 || 18 - dependencies: - loose-envify: 1.4.0 - object-assign: 4.1.1 - react: 17.0.2 - scheduler: 0.20.2 - dev: false - /react-dom/18.0.0_react@18.0.0: resolution: {integrity: sha512-XqX7uzmFo0pUceWFCt7Gff6IyIMzFUn7QMZrbrQfGxtaxXZIcGQzoNpRLE3fQLnS4XzLLPMZX2T9TRcSrasicw==} peerDependencies: - react: ^18.0.0 || 18 + react: ^18.0.0 || 18 || 18 dependencies: loose-envify: 1.4.0 react: 18.0.0 @@ -10062,14 +10040,6 @@ packages: - '@types/react' dev: false - /react/17.0.2: - resolution: {integrity: sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==} - engines: {node: '>=0.10.0'} - dependencies: - loose-envify: 1.4.0 - object-assign: 4.1.1 - dev: false - /react/18.0.0: resolution: {integrity: sha512-x+VL6wbT4JRVPm7EGxXhZ8w8LTROaxPXOqhlGyVSrv0sB1jkyFGgXxJ8LVoPRLvPR6/CIZGFmfzqUa2NYeMr2A==} engines: {node: '>=0.10.0'} @@ -10422,13 +10392,6 @@ packages: xmlchars: 2.2.0 dev: true - /scheduler/0.20.2: - resolution: {integrity: sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==} - dependencies: - loose-envify: 1.4.0 - object-assign: 4.1.1 - dev: false - /scheduler/0.21.0: resolution: {integrity: sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==} dependencies: