feat: keyboard handling in task lists

This commit is contained in:
ammarahm-ed
2022-07-18 16:27:11 +05:00
parent b827aa930a
commit e7da412517
4 changed files with 30 additions and 47 deletions

View File

@@ -9,7 +9,7 @@
"version": "1.0.0",
"hasInstallScript": true,
"dependencies": {
"@streetwriters/editor": "^1.0.3",
"@streetwriters/editor": "^1.1.1",
"@streetwriters/theme": "^1.0.0",
"framer-motion": "^4.1.17",
"mdi-react": "^8.4.0",
@@ -2971,9 +2971,9 @@
"integrity": "sha512-CUqgq2PTmdmWhNPzth9JN1cFoaFsIWhgiuDVD23hjD+9HJVD+xs3GlbZF+YWYMKVhRa3hib4A7Ev8rOjz2QBwQ=="
},
"node_modules/@streetwriters/editor": {
"version": "1.0.3",
"resolved": "https://npm.pkg.github.com/download/@streetwriters/editor/1.0.3/9ff6b957689dc6ce6442699147985ae36a0b51bf47962622fc73d396ea8c463f",
"integrity": "sha512-DgMISnZyorUT+u/pkQKe1yAYgVqE22jWBDIMxuBI7W3DtAycXvX4KjSmByfE2OKF4m7fw+Ftn0xRoUrKuwusjQ==",
"version": "1.1.1",
"resolved": "https://npm.pkg.github.com/download/@streetwriters/editor/1.1.1/5d8160e5b4382318969f1bc1cf2748f57c09b6337093a8023a1767e7a31d3e6b",
"integrity": "sha512-Pl8Ur791cRlTUAEbLufvoO6bpFt/rSbCg+i4vivZ+sB4kw74gDfM1442dz0EXaNDwID99qSDWJe46w2vSZPynw==",
"license": "GPL-3.0",
"dependencies": {
"@_ueberdosis/prosemirror-tables": "^1.1.3",
@@ -2985,7 +2985,6 @@
"@tiptap/extension-character-count": "^2.0.0-beta.31",
"@tiptap/extension-color": "^2.0.0-beta.12",
"@tiptap/extension-font-family": "^2.0.0-beta.24",
"@tiptap/extension-highlight": "^2.0.0-beta.35",
"@tiptap/extension-history": "^2.0.0-beta.26",
"@tiptap/extension-horizontal-rule": "^2.0.0-beta.36",
"@tiptap/extension-link": "^2.0.0-beta.43",
@@ -3733,18 +3732,6 @@
"@tiptap/core": "^2.0.0-beta.1"
}
},
"node_modules/@tiptap/extension-highlight": {
"version": "2.0.0-beta.35",
"resolved": "https://registry.npmjs.org/@tiptap/extension-highlight/-/extension-highlight-2.0.0-beta.35.tgz",
"integrity": "sha512-xvEKOyuTj4mhQ8GIOItaSymJhGkWt2gGuCvmFWnTVZAaJJQOlgUTdkmayLCtwoDDP7biiuDhRJokTukGGmhUZw==",
"funding": {
"type": "github",
"url": "https://github.com/sponsors/ueberdosis"
},
"peerDependencies": {
"@tiptap/core": "^2.0.0-beta.1"
}
},
"node_modules/@tiptap/extension-history": {
"version": "2.0.0-beta.26",
"resolved": "https://registry.npmjs.org/@tiptap/extension-history/-/extension-history-2.0.0-beta.26.tgz",
@@ -25762,9 +25749,9 @@
"integrity": "sha512-CUqgq2PTmdmWhNPzth9JN1cFoaFsIWhgiuDVD23hjD+9HJVD+xs3GlbZF+YWYMKVhRa3hib4A7Ev8rOjz2QBwQ=="
},
"@streetwriters/editor": {
"version": "1.0.3",
"resolved": "https://npm.pkg.github.com/download/@streetwriters/editor/1.0.3/9ff6b957689dc6ce6442699147985ae36a0b51bf47962622fc73d396ea8c463f",
"integrity": "sha512-DgMISnZyorUT+u/pkQKe1yAYgVqE22jWBDIMxuBI7W3DtAycXvX4KjSmByfE2OKF4m7fw+Ftn0xRoUrKuwusjQ==",
"version": "1.1.1",
"resolved": "https://npm.pkg.github.com/download/@streetwriters/editor/1.1.1/5d8160e5b4382318969f1bc1cf2748f57c09b6337093a8023a1767e7a31d3e6b",
"integrity": "sha512-Pl8Ur791cRlTUAEbLufvoO6bpFt/rSbCg+i4vivZ+sB4kw74gDfM1442dz0EXaNDwID99qSDWJe46w2vSZPynw==",
"requires": {
"@_ueberdosis/prosemirror-tables": "^1.1.3",
"@mdi/js": "^6.9.96",
@@ -25775,7 +25762,6 @@
"@tiptap/extension-character-count": "^2.0.0-beta.31",
"@tiptap/extension-color": "^2.0.0-beta.12",
"@tiptap/extension-font-family": "^2.0.0-beta.24",
"@tiptap/extension-highlight": "^2.0.0-beta.35",
"@tiptap/extension-history": "^2.0.0-beta.26",
"@tiptap/extension-horizontal-rule": "^2.0.0-beta.36",
"@tiptap/extension-link": "^2.0.0-beta.43",
@@ -26268,12 +26254,6 @@
"integrity": "sha512-q92jYcsT5bPhvuQaB0h44Z9r+Ii22tDYo082KMVnR4+tknHT/3xx+p4JC8KHjh+/5W8Quyafqy6mS8L8VX0zsQ==",
"requires": {}
},
"@tiptap/extension-highlight": {
"version": "2.0.0-beta.35",
"resolved": "https://registry.npmjs.org/@tiptap/extension-highlight/-/extension-highlight-2.0.0-beta.35.tgz",
"integrity": "sha512-xvEKOyuTj4mhQ8GIOItaSymJhGkWt2gGuCvmFWnTVZAaJJQOlgUTdkmayLCtwoDDP7biiuDhRJokTukGGmhUZw==",
"requires": {}
},
"@tiptap/extension-history": {
"version": "2.0.0-beta.26",
"resolved": "https://registry.npmjs.org/@tiptap/extension-history/-/extension-history-2.0.0-beta.26.tgz",

View File

@@ -3,7 +3,7 @@
"version": "1.0.0",
"private": true,
"dependencies": {
"@streetwriters/editor": "^1.0.3",
"@streetwriters/editor": "^1.1.1",
"@streetwriters/theme": "^1.0.0",
"framer-motion": "^4.1.17",
"mdi-react": "^8.4.0",

View File

@@ -4,7 +4,7 @@ import {
PortalProvider,
Toolbar,
usePermissionHandler,
useTiptap
useTiptap,
} from "@streetwriters/editor";
import { useEffect, useLayoutEffect, useRef, useState } from "react";
import { useEditorController } from "../hooks/useEditorController";
@@ -27,7 +27,7 @@ const Tiptap = () => {
global.noToolbar ||
settings.noToolbar ||
global.readonly ||
settings.readonly
settings.readonly,
});
const contentRef = useRef<HTMLDivElement>(null);
const containerRef = useRef<HTMLDivElement>(null);
@@ -36,14 +36,14 @@ const Tiptap = () => {
//todo
accent: "green",
scale: 1,
theme: theme?.night ? "dark" : "light"
theme: theme?.night ? "dark" : "light",
});
const editorTheme = useTheme({
//todo
accent: "green",
scale: 1,
theme: theme?.night ? "dark" : "light"
theme: theme?.night ? "dark" : "light",
});
editorTheme.space = [0, 10, 12, 20];
@@ -55,37 +55,37 @@ const Tiptap = () => {
...toolbarTheme.buttons.menuitem,
height: "50px",
paddingX: "20px",
borderBottomWidth: 0
borderBottomWidth: 0,
};
toolbarTheme.iconSizes = {
big: 20,
medium: 18,
small: 18
small: 18,
};
toolbarTheme.fontSizes = {
...toolbarTheme.fontSizes,
subBody: "0.8rem",
body: "0.9rem"
body: "0.9rem",
};
toolbarTheme.radii = {
...toolbarTheme.radii,
small: 5
small: 5,
};
toolbarTheme.buttons.menuitem = {
...toolbarTheme.buttons.menuitem,
px: 5,
height: "45px"
height: "45px",
};
usePermissionHandler({
claims: {
premium: settings.premium
premium: settings.premium,
},
onPermissionDenied: () => {
post(EventTypes.pro);
}
},
});
const _editor = useTiptap(
{
@@ -107,10 +107,11 @@ const Tiptap = () => {
element: !layout ? undefined : contentRef.current || undefined,
editable: !initialProps.readonly,
editorProps: {
editable: () => !initialProps.readonly
editable: () => !initialProps.readonly,
},
content: global.editorController?.content?.current,
isMobile: true
isMobile: true,
isKeyboardOpen: settings.keyboardShown,
},
[layout, initialProps.readonly, tick]
);
@@ -125,6 +126,7 @@ const Tiptap = () => {
globalThis.editor = _editor;
useEffect(() => {
logger("info", "keyboardShown", settings.keyboardShown);
setInitialProps({ ...settings });
}, [settings]);
@@ -140,7 +142,7 @@ const Tiptap = () => {
flex: 1,
flexDirection: "column",
maxWidth: "100vw",
marginBottom: "5px"
marginBottom: "5px",
}}
>
<Header
@@ -158,7 +160,7 @@ const Tiptap = () => {
height: "100%",
flexGrow: 1,
flexShrink: 1,
display: "flex"
display: "flex",
}}
>
{initialProps.noHeader ? null : (
@@ -179,7 +181,7 @@ const Tiptap = () => {
padding: 12,
paddingTop: 0,
color: theme?.pri,
flex: 1
flex: 1,
}}
/>
<div
@@ -190,7 +192,7 @@ const Tiptap = () => {
?.chain()
.focus()
.insertContentAt(lastPosition - 1, "<p></p>", {
updateSelection: true
updateSelection: true,
})
.run();
}}

View File

@@ -18,6 +18,7 @@ export type Settings = {
tools: ToolbarGroupDefinition[];
noToolbar?: boolean;
noHeader?: boolean;
keyboardShown?: boolean;
};
declare global {
@@ -120,7 +121,7 @@ export const EventTypes = {
pro: "editor-event:pro",
monograph: "editor-event:monograph",
properties: "editor-event:properties",
fullscreen: "editor-event:fullscreen"
fullscreen: "editor-event:fullscreen",
};
export function isReactNative(): boolean {
@@ -144,7 +145,7 @@ export function post(type: string, value?: unknown) {
//@ts-ignore
type: EventTypes[type] || type,
value: value,
sessionId: global.sessionId
sessionId: global.sessionId,
})
);
} else {