yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Add HTML export option (#4056)

Browse Source 
* tidy

* Add title to HTML export

* fix: Add compatability for documents without collab state

* Add HTML download option to UI

* docs

* fix nodes that required document to render

* Refactor to allow for styling of HTML export

* div>article for easier programatic content extraction
This commit is contained in:
Tom Moor
2022-09-07 13:34:39 +02:00
committed by GitHub
parent eb5126335c
commit e8a6de3f18
30 changed files with 1756 additions and 1790 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
shared/editor/nodes/Notice.tsx
View File

@@ -52,40 +52,43 @@ export default class Notice extends Node {
},
],
toDOM: (node) => {
const select = document.createElement("select");
select.addEventListener("change", this.handleStyleChange);
let icon, actions;
if (typeof document !== "undefined") {
const select = document.createElement("select");
select.addEventListener("change", this.handleStyleChange);
this.styleOptions.forEach(([key, label]) => {
const option = document.createElement("option");
option.value = key;
option.innerText = label;
option.selected = node.attrs.style === key;
select.appendChild(option);
});
this.styleOptions.forEach(([key, label]) => {
const option = document.createElement("option");
option.value = key;
option.innerText = label;
option.selected = node.attrs.style === key;
select.appendChild(option);
});
const actions = document.createElement("div");
actions.className = "notice-actions";
actions.appendChild(select);
actions = document.createElement("div");
actions.className = "notice-actions";
actions.appendChild(select);
let component;
let component;
if (node.attrs.style === "tip") {
component = <StarredIcon color="currentColor" />;
} else if (node.attrs.style === "warning") {
component = <WarningIcon color="currentColor" />;
} else {
component = <InfoIcon color="currentColor" />;
if (node.attrs.style === "tip") {
component = <StarredIcon color="currentColor" />;
} else if (node.attrs.style === "warning") {
component = <WarningIcon color="currentColor" />;
} else {
component = <InfoIcon color="currentColor" />;
}
icon = document.createElement("div");
icon.className = "icon";
ReactDOM.render(component, icon);
}
const icon = document.createElement("div");
icon.className = "icon";
ReactDOM.render(component, icon);
return [
"div",
{ class: `notice-block ${node.attrs.style}` },
icon,
["div", { contentEditable: "false" }, actions],
...(icon ? [icon] : []),
["div", { contentEditable: "false" }, ...(actions ? [actions] : [])],
["div", { class: "content" }, 0],
];
},