@formicoidea/labre-core 0.23.3 → 0.25.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/_pkgs/affine-block-surface/element-model/index.d.ts +5 -2
- package/dist/_pkgs/affine-block-surface/element-model/index.js +4 -2
- package/dist/_pkgs/affine-gfx-mindmap/index.d.ts +1 -0
- package/dist/_pkgs/affine-gfx-mindmap/index.js +1 -0
- package/dist/_pkgs/affine-gfx-mindmap/templates/index.d.ts +2 -0
- package/dist/_pkgs/affine-gfx-mindmap/templates/index.js +28 -0
- package/dist/_pkgs/affine-gfx-mindmap/toolbar/mindmap-menu.d.ts +3 -0
- package/dist/_pkgs/affine-gfx-mindmap/toolbar/mindmap-menu.js +105 -87
- package/dist/_pkgs/affine-gfx-mindmap/toolbar/mindmap-tool-button.d.ts +3 -1
- package/dist/_pkgs/affine-gfx-mindmap/toolbar/mindmap-tool-button.js +97 -146
- package/dist/_pkgs/affine-gfx-mindmap/toolbar/senior-tool.d.ts +2 -0
- package/dist/_pkgs/affine-gfx-mindmap/toolbar/senior-tool.js +12 -0
- package/dist/_pkgs/affine-gfx-mindmap/view.d.ts +17 -1
- package/dist/_pkgs/affine-gfx-mindmap/view.js +38 -4
- package/dist/_pkgs/affine-gfx-template/services/template-middlewares.js +16 -1
- package/dist/_pkgs/affine-model/elements/core-domain/core-domain.d.ts +36 -0
- package/dist/_pkgs/affine-model/elements/core-domain/core-domain.js +122 -0
- package/dist/_pkgs/affine-model/elements/core-domain/index.d.ts +1 -0
- package/dist/_pkgs/affine-model/elements/core-domain/index.js +1 -0
- package/dist/_pkgs/affine-model/elements/index.d.ts +3 -0
- package/dist/_pkgs/affine-model/elements/index.js +1 -0
- package/dist/_pkgs/affine-shared/services/telemetry-service/lifecycle.d.ts +1 -1
- package/dist/extensions/view.js +6 -2
- package/dist/flags.d.ts +1 -1
- package/dist/flags.js +1 -0
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { BpmnNodeElementModel, BpmnPoolElementModel, BrushElementModel, ConnectorElementModel, CynefinElementModel, EdgyFacetsElementModel, EdgyNodeElementModel, EstuarineElementModel, GroupElementModel, HighlighterElementModel, MindmapElementModel, ShapeElementModel, TextElementModel, WardleyBackgroundElementModel, WardleyNodeElementModel } from '../../affine-model/index.js';
|
|
1
|
+
import { BpmnNodeElementModel, BpmnPoolElementModel, BrushElementModel, ConnectorElementModel, CoreDomainChartElementModel, CynefinElementModel, EdgyFacetsElementModel, EdgyNodeElementModel, EstuarineElementModel, GroupElementModel, HighlighterElementModel, MindmapElementModel, ShapeElementModel, TextElementModel, WardleyBackgroundElementModel, WardleyNodeElementModel } from '../../affine-model/index.js';
|
|
2
2
|
import { SurfaceElementModel } from './base.js';
|
|
3
3
|
export declare const elementsCtorMap: {
|
|
4
4
|
group: typeof GroupElementModel;
|
|
@@ -14,10 +14,11 @@ export declare const elementsCtorMap: {
|
|
|
14
14
|
edgyNode: typeof EdgyNodeElementModel;
|
|
15
15
|
cynefin: typeof CynefinElementModel;
|
|
16
16
|
estuarine: typeof EstuarineElementModel;
|
|
17
|
+
coreDomain: typeof CoreDomainChartElementModel;
|
|
17
18
|
bpmnNode: typeof BpmnNodeElementModel;
|
|
18
19
|
bpmnPool: typeof BpmnPoolElementModel;
|
|
19
20
|
};
|
|
20
|
-
export { BpmnNodeElementModel, BpmnPoolElementModel, BrushElementModel, ConnectorElementModel, CynefinElementModel, EdgyFacetsElementModel, EdgyNodeElementModel, EstuarineElementModel, GroupElementModel, HighlighterElementModel, MindmapElementModel, ShapeElementModel, SurfaceElementModel, TextElementModel, WardleyBackgroundElementModel, WardleyNodeElementModel, };
|
|
21
|
+
export { BpmnNodeElementModel, BpmnPoolElementModel, BrushElementModel, ConnectorElementModel, CoreDomainChartElementModel, CynefinElementModel, EdgyFacetsElementModel, EdgyNodeElementModel, EstuarineElementModel, GroupElementModel, HighlighterElementModel, MindmapElementModel, ShapeElementModel, SurfaceElementModel, TextElementModel, WardleyBackgroundElementModel, WardleyNodeElementModel, };
|
|
21
22
|
export declare enum CanvasElementType {
|
|
22
23
|
BRUSH = "brush",
|
|
23
24
|
CONNECTOR = "connector",
|
|
@@ -32,6 +33,7 @@ export declare enum CanvasElementType {
|
|
|
32
33
|
EDGYNODE = "edgyNode",
|
|
33
34
|
CYNEFIN = "cynefin",
|
|
34
35
|
ESTUARINE = "estuarine",
|
|
36
|
+
COREDOMAIN = "coreDomain",
|
|
35
37
|
BPMNNODE = "bpmnNode",
|
|
36
38
|
BPMNPOOL = "bpmnPool"
|
|
37
39
|
}
|
|
@@ -49,6 +51,7 @@ export type ElementModelMap = {
|
|
|
49
51
|
['edgyNode']: EdgyNodeElementModel;
|
|
50
52
|
['cynefin']: CynefinElementModel;
|
|
51
53
|
['estuarine']: EstuarineElementModel;
|
|
54
|
+
['coreDomain']: CoreDomainChartElementModel;
|
|
52
55
|
['bpmnNode']: BpmnNodeElementModel;
|
|
53
56
|
['bpmnPool']: BpmnPoolElementModel;
|
|
54
57
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { BpmnNodeElementModel, BpmnPoolElementModel, BrushElementModel, ConnectorElementModel, CynefinElementModel, EdgyFacetsElementModel, EdgyNodeElementModel, EstuarineElementModel, GroupElementModel, HighlighterElementModel, MindmapElementModel, ShapeElementModel, TextElementModel, WardleyBackgroundElementModel, WardleyNodeElementModel, } from '../../affine-model/index.js';
|
|
1
|
+
import { BpmnNodeElementModel, BpmnPoolElementModel, BrushElementModel, ConnectorElementModel, CoreDomainChartElementModel, CynefinElementModel, EdgyFacetsElementModel, EdgyNodeElementModel, EstuarineElementModel, GroupElementModel, HighlighterElementModel, MindmapElementModel, ShapeElementModel, TextElementModel, WardleyBackgroundElementModel, WardleyNodeElementModel, } from '../../affine-model/index.js';
|
|
2
2
|
import { SurfaceElementModel } from './base.js';
|
|
3
3
|
export const elementsCtorMap = {
|
|
4
4
|
group: GroupElementModel,
|
|
@@ -14,10 +14,11 @@ export const elementsCtorMap = {
|
|
|
14
14
|
edgyNode: EdgyNodeElementModel,
|
|
15
15
|
cynefin: CynefinElementModel,
|
|
16
16
|
estuarine: EstuarineElementModel,
|
|
17
|
+
coreDomain: CoreDomainChartElementModel,
|
|
17
18
|
bpmnNode: BpmnNodeElementModel,
|
|
18
19
|
bpmnPool: BpmnPoolElementModel,
|
|
19
20
|
};
|
|
20
|
-
export { BpmnNodeElementModel, BpmnPoolElementModel, BrushElementModel, ConnectorElementModel, CynefinElementModel, EdgyFacetsElementModel, EdgyNodeElementModel, EstuarineElementModel, GroupElementModel, HighlighterElementModel, MindmapElementModel, ShapeElementModel, SurfaceElementModel, TextElementModel, WardleyBackgroundElementModel, WardleyNodeElementModel, };
|
|
21
|
+
export { BpmnNodeElementModel, BpmnPoolElementModel, BrushElementModel, ConnectorElementModel, CoreDomainChartElementModel, CynefinElementModel, EdgyFacetsElementModel, EdgyNodeElementModel, EstuarineElementModel, GroupElementModel, HighlighterElementModel, MindmapElementModel, ShapeElementModel, SurfaceElementModel, TextElementModel, WardleyBackgroundElementModel, WardleyNodeElementModel, };
|
|
21
22
|
export var CanvasElementType;
|
|
22
23
|
(function (CanvasElementType) {
|
|
23
24
|
CanvasElementType["BRUSH"] = "brush";
|
|
@@ -33,6 +34,7 @@ export var CanvasElementType;
|
|
|
33
34
|
CanvasElementType["EDGYNODE"] = "edgyNode";
|
|
34
35
|
CanvasElementType["CYNEFIN"] = "cynefin";
|
|
35
36
|
CanvasElementType["ESTUARINE"] = "estuarine";
|
|
37
|
+
CanvasElementType["COREDOMAIN"] = "coreDomain";
|
|
36
38
|
CanvasElementType["BPMNNODE"] = "bpmnNode";
|
|
37
39
|
CanvasElementType["BPMNPOOL"] = "bpmnPool";
|
|
38
40
|
})(CanvasElementType || (CanvasElementType = {}));
|
|
@@ -2,6 +2,7 @@ export * from './adapter';
|
|
|
2
2
|
export * from './element-renderer';
|
|
3
3
|
export * from './indicator-overlay';
|
|
4
4
|
export * from './interactivity';
|
|
5
|
+
export * from './templates';
|
|
5
6
|
export * from './toolbar/config';
|
|
6
7
|
export * from './toolbar/senior-tool';
|
|
7
8
|
export * from './utils';
|
|
@@ -2,6 +2,7 @@ export * from './adapter';
|
|
|
2
2
|
export * from './element-renderer';
|
|
3
3
|
export * from './indicator-overlay';
|
|
4
4
|
export * from './interactivity';
|
|
5
|
+
export * from './templates';
|
|
5
6
|
export * from './toolbar/config';
|
|
6
7
|
export * from './toolbar/senior-tool';
|
|
7
8
|
export * from './utils';
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { makeTemplateSnapshot, } from '../../affine-gfx-template/index.js';
|
|
2
|
+
/**
|
|
3
|
+
* Mindmap starter templates — one per built-in style. Captured as real
|
|
4
|
+
* serialized mindmaps (the element plus its node shapes) so they round-trip
|
|
5
|
+
* through the Templates-panel insert path; the id-regeneration middleware
|
|
6
|
+
* (replaceIdMiddleware) remaps the mindmap node-id references on insert.
|
|
7
|
+
*/
|
|
8
|
+
function tpl(name, preview, elements) {
|
|
9
|
+
return {
|
|
10
|
+
name,
|
|
11
|
+
type: 'template',
|
|
12
|
+
preview,
|
|
13
|
+
content: makeTemplateSnapshot(elements, name),
|
|
14
|
+
};
|
|
15
|
+
}
|
|
16
|
+
const STYLE_1 = { "1Y2vfnrsLJ": { "index": "a0", "seed": 1700105571, "fillColor": "#ffffff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontWeight": "600", "maxWidth": false, "padding": [11, 22], "radius": 8, "rotate": 0, "roughness": 1.4, "shadow": { "offsetX": 0, "offsetY": 6, "blur": 12, "color": "rgba(0, 0, 0, 0.14)" }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "#53b2ef", "strokeStyle": "solid", "strokeWidth": 4, "text": { "affine:surface:text": true, "delta": [{ "insert": "Mind Map" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[0,0,136.20703125,45]", "type": "shape", "id": "1Y2vfnrsLJ" }, "K_WWv7xJKi": { "index": "a0", "seed": 1580354321, "fillColor": "#ffffff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "500", "maxWidth": false, "padding": [6, 22], "radius": 8, "rotate": 0, "roughness": 1.4, "shadow": { "offsetX": 0, "offsetY": 6, "blur": 12, "color": "rgba(0, 0, 0, 0.14)" }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "#6e52df", "strokeStyle": "solid", "strokeWidth": 3, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 1" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[336.20703125,-67.5,94.6953125,30]", "type": "shape", "id": "K_WWv7xJKi" }, "7fO_u4_Elm": { "index": "a0", "seed": 1196740856, "fillColor": "#ffffff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "500", "maxWidth": false, "padding": [6, 22], "radius": 8, "rotate": 0, "roughness": 1.4, "shadow": { "offsetX": 0, "offsetY": 6, "blur": 12, "color": "rgba(0, 0, 0, 0.14)" }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "#e96cab", "strokeStyle": "solid", "strokeWidth": 3, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 2" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[336.20703125,7.5,94.6953125,30]", "type": "shape", "id": "7fO_u4_Elm" }, "Lza2YDXgkV": { "index": "a0", "seed": 981612871, "fillColor": "#ffffff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "500", "maxWidth": false, "padding": [6, 22], "radius": 8, "rotate": 0, "roughness": 1.4, "shadow": { "offsetX": 0, "offsetY": 6, "blur": 12, "color": "rgba(0, 0, 0, 0.14)" }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "#ff8c38", "strokeStyle": "solid", "strokeWidth": 3, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 3" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[336.20703125,82.5,94.6953125,30]", "type": "shape", "id": "Lza2YDXgkV" }, "Gsko87TmXj": { "index": "a0", "seed": 871727345, "children": { "affine:surface:ymap": true, "json": { "1Y2vfnrsLJ": { "index": "a0" }, "K_WWv7xJKi": { "index": "a0", "parent": "1Y2vfnrsLJ" }, "7fO_u4_Elm": { "index": "a1", "parent": "1Y2vfnrsLJ" }, "Lza2YDXgkV": { "index": "a2", "parent": "1Y2vfnrsLJ" } } }, "layoutType": 0, "style": 1, "type": "mindmap", "id": "Gsko87TmXj" } };
|
|
17
|
+
const STYLE_2 = { "kPwf_uD4jZ": { "index": "a0", "seed": 1047170436, "fillColor": "#fcd34d", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 18, "fontWeight": "600", "maxWidth": false, "padding": [11, 22], "radius": 3, "rotate": 0, "roughness": 1.4, "shadow": { "blur": 0, "offsetX": 3, "offsetY": 3, "color": { "dark": "#ffffff", "light": "#000000" } }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": { "dark": "#ffffff", "light": "#000000" }, "strokeStyle": "solid", "strokeWidth": 3, "text": { "affine:surface:text": true, "delta": [{ "insert": "Mind Map" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[0,0,126.986328125,42.7]", "type": "shape", "id": "kPwf_uD4jZ" }, "zwZHwYXnAG": { "index": "a0", "seed": 79321525, "fillColor": "#84cfff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "600", "maxWidth": false, "padding": [6, 22], "radius": 3, "rotate": 0, "roughness": 1.4, "shadow": { "blur": 0, "offsetX": 3, "offsetY": 3, "color": { "dark": "#ffffff", "light": "#000000" } }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": { "dark": "#ffffff", "light": "#000000" }, "strokeStyle": "solid", "strokeWidth": 3, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 1" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[326.986328125,-69.25,98.8203125,30.400000000000002]", "type": "shape", "id": "zwZHwYXnAG" }, "VIz858biOY": { "index": "a0", "seed": 1187771384, "fillColor": "#84cfff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "600", "maxWidth": false, "padding": [6, 22], "radius": 3, "rotate": 0, "roughness": 1.4, "shadow": { "blur": 0, "offsetX": 3, "offsetY": 3, "color": { "dark": "#ffffff", "light": "#000000" } }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": { "dark": "#ffffff", "light": "#000000" }, "strokeStyle": "solid", "strokeWidth": 3, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 2" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[326.986328125,6.150000000000006,98.8203125,30.400000000000002]", "type": "shape", "id": "VIz858biOY" }, "DPMWxLX_cs": { "index": "a0", "seed": 1192286986, "fillColor": "#84cfff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "600", "maxWidth": false, "padding": [6, 22], "radius": 3, "rotate": 0, "roughness": 1.4, "shadow": { "blur": 0, "offsetX": 3, "offsetY": 3, "color": { "dark": "#ffffff", "light": "#000000" } }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": { "dark": "#ffffff", "light": "#000000" }, "strokeStyle": "solid", "strokeWidth": 3, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 3" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[326.986328125,81.55000000000001,98.8203125,30.400000000000002]", "type": "shape", "id": "DPMWxLX_cs" }, "nMfQ2gc-O2": { "index": "a0", "seed": 1612961410, "children": { "affine:surface:ymap": true, "json": { "kPwf_uD4jZ": { "index": "a0" }, "zwZHwYXnAG": { "index": "a0", "parent": "kPwf_uD4jZ" }, "VIz858biOY": { "index": "a1", "parent": "kPwf_uD4jZ" }, "DPMWxLX_cs": { "index": "a2", "parent": "kPwf_uD4jZ" } } }, "layoutType": 0, "style": 2, "type": "mindmap", "id": "nMfQ2gc-O2" } };
|
|
18
|
+
const STYLE_3 = { "ZIw4rmcVBn": { "index": "a0", "seed": 880670515, "fillColor": "#fcd34d", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "500", "maxWidth": false, "padding": [10, 22], "radius": 10, "rotate": 0, "roughness": 1.4, "shadow": { "blur": 12, "offsetX": 0, "offsetY": 0, "color": "rgba(66, 65, 73, 0.18)" }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "transparent", "strokeStyle": "solid", "strokeWidth": 0, "text": { "affine:surface:text": true, "delta": [{ "insert": "Mind Map" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[0,0,114.25,38]", "type": "shape", "id": "ZIw4rmcVBn" }, "dwRkKPG-3B": { "index": "a0", "seed": 125208616, "fillColor": "#ffffff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "500", "maxWidth": false, "padding": [6, 22], "radius": 10, "rotate": 0, "roughness": 1.4, "shadow": { "blur": 12, "offsetX": 0, "offsetY": 0, "color": "rgba(66, 65, 73, 0.18)" }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "#fcd34d", "strokeStyle": "solid", "strokeWidth": 2, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 1" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[314.25,-71,94.6953125,30]", "type": "shape", "id": "dwRkKPG-3B" }, "c7LOmcZzw5": { "index": "a0", "seed": 1361083332, "fillColor": "#ffffff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "500", "maxWidth": false, "padding": [6, 22], "radius": 10, "rotate": 0, "roughness": 1.4, "shadow": { "blur": 12, "offsetX": 0, "offsetY": 0, "color": "rgba(66, 65, 73, 0.18)" }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "#fcd34d", "strokeStyle": "solid", "strokeWidth": 2, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 2" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[314.25,4,94.6953125,30]", "type": "shape", "id": "c7LOmcZzw5" }, "FE0kD_GYHx": { "index": "a0", "seed": 774157552, "fillColor": "#ffffff", "filled": true, "fontFamily": "blocksuite:surface:Poppins", "fontSize": 16, "fontWeight": "500", "maxWidth": false, "padding": [6, 22], "radius": 10, "rotate": 0, "roughness": 1.4, "shadow": { "blur": 12, "offsetX": 0, "offsetY": 0, "color": "rgba(66, 65, 73, 0.18)" }, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "#fcd34d", "strokeStyle": "solid", "strokeWidth": 2, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 3" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[314.25,79,94.6953125,30]", "type": "shape", "id": "FE0kD_GYHx" }, "wR3Bc0vWc_": { "index": "a0", "seed": 660798577, "children": { "affine:surface:ymap": true, "json": { "ZIw4rmcVBn": { "index": "a0" }, "dwRkKPG-3B": { "index": "a0", "parent": "ZIw4rmcVBn" }, "c7LOmcZzw5": { "index": "a1", "parent": "ZIw4rmcVBn" }, "FE0kD_GYHx": { "index": "a2", "parent": "ZIw4rmcVBn" } } }, "layoutType": 0, "style": 3, "type": "mindmap", "id": "wR3Bc0vWc_" } };
|
|
19
|
+
const STYLE_4 = { "EyUas98ZAK": { "index": "a0", "seed": 1433519934, "color": { "dark": "#ffffff", "light": "#000000" }, "fillColor": "transparent", "filled": true, "fontFamily": "blocksuite:surface:Kalam", "fontSize": 22, "fontWeight": "700", "maxWidth": false, "padding": [0, 10], "radius": 0, "rotate": 0, "roughness": 1.4, "shadow": null, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "transparent", "strokeStyle": "solid", "strokeWidth": 0, "text": { "affine:surface:text": true, "delta": [{ "insert": "Mind Map" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[0,0,121.427734375,26]", "type": "shape", "id": "EyUas98ZAK" }, "8AX6hJveTK": { "index": "a0", "seed": 1032075934, "color": { "dark": "#ffffff", "light": "#000000" }, "fillColor": "transparent", "filled": true, "fontFamily": "blocksuite:surface:Kalam", "fontSize": 18, "fontWeight": "700", "maxWidth": false, "padding": [1.5, 10], "radius": 0, "rotate": 0, "roughness": 1.4, "shadow": null, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "transparent", "strokeStyle": "solid", "strokeWidth": 0, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 1" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[321.427734375,-68.40909090909092,81.6728515625,24.272727272727273]", "type": "shape", "id": "8AX6hJveTK" }, "sk6jIhglvv": { "index": "a0", "seed": 1054014636, "color": { "dark": "#ffffff", "light": "#000000" }, "fillColor": "transparent", "filled": true, "fontFamily": "blocksuite:surface:Kalam", "fontSize": 18, "fontWeight": "700", "maxWidth": false, "padding": [1.5, 10], "radius": 0, "rotate": 0, "roughness": 1.4, "shadow": null, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "transparent", "strokeStyle": "solid", "strokeWidth": 0, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 2" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[321.427734375,0.8636363636363598,81.6728515625,24.272727272727273]", "type": "shape", "id": "sk6jIhglvv" }, "ua9jCGGYRE": { "index": "a0", "seed": 2140202745, "color": { "dark": "#ffffff", "light": "#000000" }, "fillColor": "transparent", "filled": true, "fontFamily": "blocksuite:surface:Kalam", "fontSize": 18, "fontWeight": "700", "maxWidth": false, "padding": [1.5, 10], "radius": 0, "rotate": 0, "roughness": 1.4, "shadow": null, "shapeStyle": "General", "shapeType": "rect", "strokeColor": "transparent", "strokeStyle": "solid", "strokeWidth": 0, "text": { "affine:surface:text": true, "delta": [{ "insert": "Topic 3" }] }, "textResizing": 0, "vertices": null, "isClosed": true, "smoothFlags": null, "controlPoints": null, "xywh": "[321.427734375,70.13636363636364,81.6728515625,24.272727272727273]", "type": "shape", "id": "ua9jCGGYRE" }, "nqaFHOZEOd": { "index": "a0", "seed": 664701650, "children": { "affine:surface:ymap": true, "json": { "EyUas98ZAK": { "index": "a0" }, "8AX6hJveTK": { "index": "a0", "parent": "EyUas98ZAK" }, "sk6jIhglvv": { "index": "a1", "parent": "EyUas98ZAK" }, "ua9jCGGYRE": { "index": "a2", "parent": "EyUas98ZAK" } } }, "layoutType": 0, "style": 4, "type": "mindmap", "id": "nqaFHOZEOd" } };
|
|
20
|
+
export const mindmapTemplateCategory = {
|
|
21
|
+
name: 'Mind Map',
|
|
22
|
+
templates: [
|
|
23
|
+
tpl('Mind Map — Style 1', `<svg width="100%" height="100%" viewBox="0 0 135 80" xmlns="http://www.w3.org/2000/svg" fill="none"><rect x="8" y="33" width="40" height="16" rx="5" fill="#53b2ef" fill-opacity="0.18" stroke="#53b2ef" stroke-width="1.6"/><g stroke="#53b2ef" stroke-width="1.4"><path d="M48 41 H72 M72 41 V20 M72 41 V62 M72 20 H96 M72 62 H96"/></g><g fill="#fff" stroke="#53b2ef" stroke-width="1.4"><rect x="96" y="13" width="31" height="13" rx="4"/><rect x="96" y="34" width="31" height="13" rx="4"/><rect x="96" y="55" width="31" height="13" rx="4"/></g></svg>`, STYLE_1),
|
|
24
|
+
tpl('Mind Map — Style 2', `<svg width="100%" height="100%" viewBox="0 0 135 80" xmlns="http://www.w3.org/2000/svg" fill="none"><rect x="8" y="33" width="40" height="16" rx="5" fill="#53b2ef" fill-opacity="0.18" stroke="#53b2ef" stroke-width="1.6"/><g stroke="#53b2ef" stroke-width="1.4"><path d="M48 41 H72 M72 41 V20 M72 41 V62 M72 20 H96 M72 62 H96"/></g><g fill="#fff" stroke="#53b2ef" stroke-width="1.4"><rect x="96" y="13" width="31" height="13" rx="4"/><rect x="96" y="34" width="31" height="13" rx="4"/><rect x="96" y="55" width="31" height="13" rx="4"/></g></svg>`, STYLE_2),
|
|
25
|
+
tpl('Mind Map — Style 3', `<svg width="100%" height="100%" viewBox="0 0 135 80" xmlns="http://www.w3.org/2000/svg" fill="none"><rect x="8" y="33" width="40" height="16" rx="5" fill="#53b2ef" fill-opacity="0.18" stroke="#53b2ef" stroke-width="1.6"/><g stroke="#53b2ef" stroke-width="1.4"><path d="M48 41 H72 M72 41 V20 M72 41 V62 M72 20 H96 M72 62 H96"/></g><g fill="#fff" stroke="#53b2ef" stroke-width="1.4"><rect x="96" y="13" width="31" height="13" rx="4"/><rect x="96" y="34" width="31" height="13" rx="4"/><rect x="96" y="55" width="31" height="13" rx="4"/></g></svg>`, STYLE_3),
|
|
26
|
+
tpl('Mind Map — Style 4', `<svg width="100%" height="100%" viewBox="0 0 135 80" xmlns="http://www.w3.org/2000/svg" fill="none"><rect x="8" y="33" width="40" height="16" rx="5" fill="#53b2ef" fill-opacity="0.18" stroke="#53b2ef" stroke-width="1.6"/><g stroke="#53b2ef" stroke-width="1.4"><path d="M48 41 H72 M72 41 V20 M72 41 V62 M72 20 H96 M72 62 H96"/></g><g fill="#fff" stroke="#53b2ef" stroke-width="1.4"><rect x="96" y="13" width="31" height="13" rx="4"/><rect x="96" y="34" width="31" height="13" rx="4"/><rect x="96" y="55" width="31" height="13" rx="4"/></g></svg>`, STYLE_4),
|
|
27
|
+
],
|
|
28
|
+
};
|
|
@@ -34,6 +34,9 @@ export declare class EdgelessMindmapMenu extends EdgelessMindmapMenu_base {
|
|
|
34
34
|
render(): TemplateResult<1>;
|
|
35
35
|
updated(changedProperties: Map<PropertyKey, unknown>): void;
|
|
36
36
|
accessor model: BlockModel;
|
|
37
|
+
/** Which sections to render: the "Others" button shows media + text, the
|
|
38
|
+
* dedicated "Mind Map" button shows the mindmap styles + import. */
|
|
39
|
+
accessor variant: 'mindmap' | 'other';
|
|
37
40
|
accessor onActiveStyleChange: (style: MindmapStyle) => void;
|
|
38
41
|
accessor onImportMindMap: (bound: Bound) => Promise<void>;
|
|
39
42
|
accessor std: BlockStdScope;
|
|
@@ -60,6 +60,9 @@ let EdgelessMindmapMenu = (() => {
|
|
|
60
60
|
let _model_decorators;
|
|
61
61
|
let _model_initializers = [];
|
|
62
62
|
let _model_extraInitializers = [];
|
|
63
|
+
let _variant_decorators;
|
|
64
|
+
let _variant_initializers = [];
|
|
65
|
+
let _variant_extraInitializers = [];
|
|
63
66
|
let _onActiveStyleChange_decorators;
|
|
64
67
|
let _onActiveStyleChange_initializers = [];
|
|
65
68
|
let _onActiveStyleChange_extraInitializers = [];
|
|
@@ -73,10 +76,12 @@ let EdgelessMindmapMenu = (() => {
|
|
|
73
76
|
static {
|
|
74
77
|
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
75
78
|
_model_decorators = [consume({ context: modelContext })];
|
|
79
|
+
_variant_decorators = [property({ attribute: false })];
|
|
76
80
|
_onActiveStyleChange_decorators = [property({ attribute: false })];
|
|
77
81
|
_onImportMindMap_decorators = [property({ attribute: false })];
|
|
78
82
|
_std_decorators = [consume({ context: stdContext })];
|
|
79
83
|
__esDecorate(this, null, _model_decorators, { kind: "accessor", name: "model", static: false, private: false, access: { has: obj => "model" in obj, get: obj => obj.model, set: (obj, value) => { obj.model = value; } }, metadata: _metadata }, _model_initializers, _model_extraInitializers);
|
|
84
|
+
__esDecorate(this, null, _variant_decorators, { kind: "accessor", name: "variant", static: false, private: false, access: { has: obj => "variant" in obj, get: obj => obj.variant, set: (obj, value) => { obj.variant = value; } }, metadata: _metadata }, _variant_initializers, _variant_extraInitializers);
|
|
80
85
|
__esDecorate(this, null, _onActiveStyleChange_decorators, { kind: "accessor", name: "onActiveStyleChange", static: false, private: false, access: { has: obj => "onActiveStyleChange" in obj, get: obj => obj.onActiveStyleChange, set: (obj, value) => { obj.onActiveStyleChange = value; } }, metadata: _metadata }, _onActiveStyleChange_initializers, _onActiveStyleChange_extraInitializers);
|
|
81
86
|
__esDecorate(this, null, _onImportMindMap_decorators, { kind: "accessor", name: "onImportMindMap", static: false, private: false, access: { has: obj => "onImportMindMap" in obj, get: obj => obj.onImportMindMap, set: (obj, value) => { obj.onImportMindMap = value; } }, metadata: _metadata }, _onImportMindMap_initializers, _onImportMindMap_extraInitializers);
|
|
82
87
|
__esDecorate(this, null, _std_decorators, { kind: "accessor", name: "std", static: false, private: false, access: { has: obj => "std" in obj, get: obj => obj.std, set: (obj, value) => { obj.std = value; } }, metadata: _metadata }, _std_initializers, _std_extraInitializers);
|
|
@@ -277,100 +282,104 @@ let EdgelessMindmapMenu = (() => {
|
|
|
277
282
|
const isDraggingMedia = draggingElement?.data?.type === 'media';
|
|
278
283
|
const isDraggingText = draggingElement?.data?.type === 'text';
|
|
279
284
|
const showNextText = dragOut && !cancelled;
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
285
|
+
// The menu is shared by two senior buttons: the "Others" button (media +
|
|
286
|
+
// text) and the dedicated "Mind Map" button (mindmap styles + import).
|
|
287
|
+
const otherSection = this.variant === 'other'
|
|
288
|
+
? html `
|
|
289
|
+
<div class="media-item">
|
|
290
|
+
${isDraggingMedia
|
|
291
|
+
? html `<button
|
|
292
|
+
class="next"
|
|
293
|
+
style="transform: translateY(${showNextText ? 0 : 64}px)"
|
|
294
|
+
>
|
|
295
|
+
${mediaItem.icon}
|
|
296
|
+
</button>`
|
|
297
|
+
: nothing}
|
|
298
|
+
<button
|
|
299
|
+
style="opacity: ${isDraggingMedia ? 0 : 1}"
|
|
300
|
+
@mousedown=${(e) => this.draggableController.onMouseDown(e, {
|
|
301
|
+
preview: mediaItem.icon,
|
|
302
|
+
data: mediaItem,
|
|
303
|
+
})}
|
|
304
|
+
@touchstart=${(e) => this.draggableController.onTouchStart(e, {
|
|
305
|
+
preview: mediaItem.icon,
|
|
306
|
+
data: mediaItem,
|
|
307
|
+
})}
|
|
287
308
|
>
|
|
288
309
|
${mediaItem.icon}
|
|
289
|
-
</button
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
310
|
+
</button>
|
|
311
|
+
<affine-tooltip tip-position="top" .offset=${12}>
|
|
312
|
+
<affine-tooltip-content-with-shortcut
|
|
313
|
+
data-tip="${'Add media'}"
|
|
314
|
+
></affine-tooltip-content-with-shortcut>
|
|
315
|
+
</affine-tooltip>
|
|
316
|
+
</div>
|
|
317
|
+
<div class="thin-divider"></div>
|
|
318
|
+
<div class="text-item">
|
|
319
|
+
${isDraggingText
|
|
320
|
+
? html `<button
|
|
321
|
+
class="next"
|
|
322
|
+
style="transform: translateY(${showNextText ? 0 : 64}px)"
|
|
323
|
+
>
|
|
324
|
+
${textItem.icon}
|
|
325
|
+
</button>`
|
|
326
|
+
: nothing}
|
|
327
|
+
<button
|
|
328
|
+
style="opacity: ${isDraggingText ? 0 : 1}"
|
|
329
|
+
@mousedown=${(e) => this.draggableController.onMouseDown(e, {
|
|
330
|
+
preview: textItem.icon,
|
|
331
|
+
data: textItem,
|
|
332
|
+
})}
|
|
333
|
+
@touchstart=${(e) => this.draggableController.onTouchStart(e, {
|
|
334
|
+
preview: textItem.icon,
|
|
335
|
+
data: textItem,
|
|
336
|
+
})}
|
|
316
337
|
>
|
|
317
338
|
${textItem.icon}
|
|
318
|
-
</button
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
></affine-tooltip-content-with-shortcut>
|
|
338
|
-
</affine-tooltip>
|
|
339
|
-
</div>
|
|
340
|
-
<div class="thin-divider"></div>
|
|
341
|
-
<!-- mind map -->
|
|
342
|
-
${repeat(this.mindMaps, mindMap => {
|
|
343
|
-
const isDraggingMindMap = draggingElement?.data?.type !== 'text';
|
|
344
|
-
const draggingEle = draggingElement?.data;
|
|
345
|
-
const isBeingDragged = isDraggingMindMap && draggingEle?.style === mindMap.style;
|
|
346
|
-
const showNext = dragOut && !cancelled;
|
|
347
|
-
const isActive = this._style$.value === mindMap.style;
|
|
348
|
-
return html `
|
|
339
|
+
</button>
|
|
340
|
+
<affine-tooltip tip-position="top" .offset=${12}>
|
|
341
|
+
<affine-tooltip-content-with-shortcut
|
|
342
|
+
data-tip="${'Edgeless Text'}"
|
|
343
|
+
data-shortcup="${'T'}"
|
|
344
|
+
></affine-tooltip-content-with-shortcut>
|
|
345
|
+
</affine-tooltip>
|
|
346
|
+
</div>
|
|
347
|
+
`
|
|
348
|
+
: nothing;
|
|
349
|
+
const mindmapSection = this.variant === 'mindmap'
|
|
350
|
+
? html `
|
|
351
|
+
${repeat(this.mindMaps, mindMap => {
|
|
352
|
+
const isDraggingMindMap = draggingElement?.data?.type !== 'text';
|
|
353
|
+
const draggingEle = draggingElement?.data;
|
|
354
|
+
const isBeingDragged = isDraggingMindMap && draggingEle?.style === mindMap.style;
|
|
355
|
+
const showNext = dragOut && !cancelled;
|
|
356
|
+
const isActive = this._style$.value === mindMap.style;
|
|
357
|
+
return html `
|
|
349
358
|
<div class="mindmap-item" data-is-active=${isActive}>
|
|
350
359
|
${isBeingDragged
|
|
351
|
-
|
|
360
|
+
? html `<button
|
|
352
361
|
style="transform: translateY(${showNext ? 0 : 64}px)"
|
|
353
362
|
class="next"
|
|
354
363
|
>
|
|
355
364
|
${mindMap.icon}
|
|
356
365
|
</button>`
|
|
357
|
-
|
|
366
|
+
: nothing}
|
|
358
367
|
<button
|
|
359
368
|
style="opacity: ${isBeingDragged ? 0 : 1}"
|
|
360
369
|
@mousedown=${(e) => {
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
370
|
+
this.draggableController.onMouseDown(e, {
|
|
371
|
+
preview: mindMap.icon,
|
|
372
|
+
data: mindMap,
|
|
373
|
+
standardWidth: 350,
|
|
374
|
+
});
|
|
375
|
+
}}
|
|
367
376
|
@touchstart=${(e) => {
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
377
|
+
this.draggableController.onTouchStart(e, {
|
|
378
|
+
preview: mindMap.icon,
|
|
379
|
+
data: mindMap,
|
|
380
|
+
standardWidth: 350,
|
|
381
|
+
});
|
|
382
|
+
}}
|
|
374
383
|
@click=${() => this.onActiveStyleChange?.(mindMap.style)}
|
|
375
384
|
>
|
|
376
385
|
${mindMap.icon}
|
|
@@ -383,13 +392,16 @@ let EdgelessMindmapMenu = (() => {
|
|
|
383
392
|
</affine-tooltip>
|
|
384
393
|
</div>
|
|
385
394
|
`;
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
395
|
+
})}
|
|
396
|
+
${this.std.store
|
|
397
|
+
.get(FeatureFlagService)
|
|
398
|
+
.getFlag('enable_mind_map_import')
|
|
399
|
+
? this._importMindMapEntry()
|
|
400
|
+
: nothing}
|
|
401
|
+
`
|
|
402
|
+
: nothing;
|
|
403
|
+
return html `<edgeless-slide-menu .height=${'64px'}>
|
|
404
|
+
<div class="text-and-mindmap">${otherSection}${mindmapSection}</div>
|
|
393
405
|
</edgeless-slide-menu>`;
|
|
394
406
|
}
|
|
395
407
|
updated(changedProperties) {
|
|
@@ -400,6 +412,11 @@ let EdgelessMindmapMenu = (() => {
|
|
|
400
412
|
#model_accessor_storage;
|
|
401
413
|
get model() { return this.#model_accessor_storage; }
|
|
402
414
|
set model(value) { this.#model_accessor_storage = value; }
|
|
415
|
+
#variant_accessor_storage;
|
|
416
|
+
/** Which sections to render: the "Others" button shows media + text, the
|
|
417
|
+
* dedicated "Mind Map" button shows the mindmap styles + import. */
|
|
418
|
+
get variant() { return this.#variant_accessor_storage; }
|
|
419
|
+
set variant(value) { this.#variant_accessor_storage = value; }
|
|
403
420
|
#onActiveStyleChange_accessor_storage;
|
|
404
421
|
get onActiveStyleChange() { return this.#onActiveStyleChange_accessor_storage; }
|
|
405
422
|
set onActiveStyleChange(value) { this.#onActiveStyleChange_accessor_storage = value; }
|
|
@@ -417,7 +434,8 @@ let EdgelessMindmapMenu = (() => {
|
|
|
417
434
|
});
|
|
418
435
|
this.type = EmptyTool;
|
|
419
436
|
this.#model_accessor_storage = __runInitializers(this, _model_initializers, void 0);
|
|
420
|
-
this.#
|
|
437
|
+
this.#variant_accessor_storage = (__runInitializers(this, _model_extraInitializers), __runInitializers(this, _variant_initializers, 'mindmap'));
|
|
438
|
+
this.#onActiveStyleChange_accessor_storage = (__runInitializers(this, _variant_extraInitializers), __runInitializers(this, _onActiveStyleChange_initializers, void 0));
|
|
421
439
|
this.#onImportMindMap_accessor_storage = (__runInitializers(this, _onActiveStyleChange_extraInitializers), __runInitializers(this, _onImportMindMap_initializers, void 0));
|
|
422
440
|
this.#std_accessor_storage = (__runInitializers(this, _onImportMindMap_extraInitializers), __runInitializers(this, _std_initializers, void 0));
|
|
423
441
|
__runInitializers(this, _std_extraInitializers);
|
|
@@ -16,7 +16,9 @@ export declare class EdgelessMindmapToolButton extends EdgelessMindmapToolButton
|
|
|
16
16
|
initDragController(): void;
|
|
17
17
|
render(): import("lit-html").TemplateResult<1>;
|
|
18
18
|
updated(_changedProperties: Map<PropertyKey, unknown>): void;
|
|
19
|
-
|
|
19
|
+
/** `'mindmap'` → the dedicated Mind Map button; `'other'` → free-text +
|
|
20
|
+
* add-file ("Others"). Drives the tools, tooltip, `m` shortcut and menu. */
|
|
21
|
+
accessor variant: 'mindmap' | 'other';
|
|
20
22
|
accessor mindmapElement: HTMLElement;
|
|
21
23
|
accessor readyToDrop: boolean;
|
|
22
24
|
}
|
|
@@ -35,7 +35,7 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
|
|
|
35
35
|
import { DefaultTool, EdgelessCRUDIdentifier, } from '../../affine-block-surface/index.js';
|
|
36
36
|
import { EmptyTool } from '../../affine-gfx-pointer/index.js';
|
|
37
37
|
import { TextTool } from '../../affine-gfx-text/index.js';
|
|
38
|
-
import { EditPropsStore,
|
|
38
|
+
import { EditPropsStore, ViewportElementProvider, } from '../../affine-shared/services/index.js';
|
|
39
39
|
import { EdgelessDraggableElementController, EdgelessToolbarToolMixin, } from '../../affine-widget-edgeless-toolbar/index.js';
|
|
40
40
|
import { SignalWatcher } from '../../global/lit/index.js';
|
|
41
41
|
import { computed } from '@preact/signals-core';
|
|
@@ -46,13 +46,13 @@ import { repeat } from 'lit/directives/repeat.js';
|
|
|
46
46
|
import { styleMap } from 'lit/directives/style-map.js';
|
|
47
47
|
import { getMindMaps } from './assets.js';
|
|
48
48
|
import { getMindmapRender, mediaConfig, mediaRender, mindmapConfig, textConfig, textRender, toolConfig2StyleObj, } from './basket-elements.js';
|
|
49
|
-
import {
|
|
49
|
+
import { mindmapMenuMediaIcon, textIcon } from './icons.js';
|
|
50
50
|
import { importMindmap } from './utils/import-mindmap.js';
|
|
51
51
|
let EdgelessMindmapToolButton = (() => {
|
|
52
52
|
let _classSuper = EdgelessToolbarToolMixin(SignalWatcher(LitElement));
|
|
53
|
-
let
|
|
54
|
-
let
|
|
55
|
-
let
|
|
53
|
+
let _variant_decorators;
|
|
54
|
+
let _variant_initializers = [];
|
|
55
|
+
let _variant_extraInitializers = [];
|
|
56
56
|
let _mindmapElement_decorators;
|
|
57
57
|
let _mindmapElement_initializers = [];
|
|
58
58
|
let _mindmapElement_extraInitializers = [];
|
|
@@ -62,10 +62,10 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
62
62
|
return class EdgelessMindmapToolButton extends _classSuper {
|
|
63
63
|
static {
|
|
64
64
|
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
65
|
-
|
|
65
|
+
_variant_decorators = [property({ attribute: false })];
|
|
66
66
|
_mindmapElement_decorators = [query('.basket-tool-item.mindmap')];
|
|
67
67
|
_readyToDrop_decorators = [state()];
|
|
68
|
-
__esDecorate(this, null,
|
|
68
|
+
__esDecorate(this, null, _variant_decorators, { kind: "accessor", name: "variant", static: false, private: false, access: { has: obj => "variant" in obj, get: obj => obj.variant, set: (obj, value) => { obj.variant = value; } }, metadata: _metadata }, _variant_initializers, _variant_extraInitializers);
|
|
69
69
|
__esDecorate(this, null, _mindmapElement_decorators, { kind: "accessor", name: "mindmapElement", static: false, private: false, access: { has: obj => "mindmapElement" in obj, get: obj => obj.mindmapElement, set: (obj, value) => { obj.mindmapElement = value; } }, metadata: _metadata }, _mindmapElement_initializers, _mindmapElement_extraInitializers);
|
|
70
70
|
__esDecorate(this, null, _readyToDrop_decorators, { kind: "accessor", name: "readyToDrop", static: false, private: false, access: { has: obj => "readyToDrop" in obj, get: obj => obj.readyToDrop, set: (obj, value) => { obj.readyToDrop = value; } }, metadata: _metadata }, _readyToDrop_initializers, _readyToDrop_extraInitializers);
|
|
71
71
|
if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
@@ -77,6 +77,11 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
77
77
|
display: flex;
|
|
78
78
|
justify-content: center;
|
|
79
79
|
align-items: center;
|
|
80
|
+
/* Make this button the containing block of the popup's clip wrapper so
|
|
81
|
+
the "Others" sub-menu anchors to THIS button (not the whole toolbar)
|
|
82
|
+
and can be right-aligned to it — mirrors the framework senior buttons.
|
|
83
|
+
Without this the menu drifts when senior buttons are hidden. */
|
|
84
|
+
position: relative;
|
|
80
85
|
}
|
|
81
86
|
.partial-clip {
|
|
82
87
|
flex-shrink: 0;
|
|
@@ -86,88 +91,57 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
86
91
|
padding: 0 10px;
|
|
87
92
|
overflow: hidden;
|
|
88
93
|
}
|
|
94
|
+
/* Icons sit centered in the slot — no basket tray. */
|
|
89
95
|
.basket-wrapper {
|
|
90
96
|
pointer-events: auto;
|
|
91
97
|
height: 64px;
|
|
92
98
|
width: 96px;
|
|
93
99
|
display: flex;
|
|
94
100
|
justify-content: center;
|
|
95
|
-
align-items:
|
|
101
|
+
align-items: center;
|
|
102
|
+
gap: 4px;
|
|
96
103
|
position: relative;
|
|
97
104
|
}
|
|
98
|
-
.basket,
|
|
99
|
-
.basket-tool-item {
|
|
100
|
-
transition: transform 0.3s ease-in-out;
|
|
101
|
-
position: absolute;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
.basket {
|
|
105
|
-
bottom: 0;
|
|
106
|
-
height: 17px;
|
|
107
|
-
width: 76px;
|
|
108
|
-
}
|
|
109
|
-
.basket > div,
|
|
110
|
-
.basket > svg {
|
|
111
|
-
position: absolute;
|
|
112
|
-
}
|
|
113
|
-
.glass {
|
|
114
|
-
width: 76px;
|
|
115
|
-
height: 17px;
|
|
116
|
-
border-radius: 2px;
|
|
117
|
-
mask: url(#mindmap-basket-body-mask);
|
|
118
|
-
}
|
|
119
|
-
.glass.enabled {
|
|
120
|
-
backdrop-filter: blur(2px);
|
|
121
|
-
}
|
|
122
|
-
@-moz-document url-prefix() {
|
|
123
|
-
.glass.enabled {
|
|
124
|
-
backdrop-filter: none;
|
|
125
|
-
}
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
.basket {
|
|
129
|
-
z-index: 3;
|
|
130
|
-
}
|
|
131
105
|
.basket-tool-item {
|
|
106
|
+
position: relative;
|
|
132
107
|
cursor: grab;
|
|
108
|
+
transition: transform 0.3s ease-in-out;
|
|
133
109
|
}
|
|
134
110
|
.basket-tool-item svg {
|
|
135
111
|
display: block;
|
|
112
|
+
max-width: 46px;
|
|
113
|
+
max-height: 46px;
|
|
114
|
+
width: auto;
|
|
115
|
+
height: auto;
|
|
136
116
|
}
|
|
137
|
-
|
|
138
|
-
transform: translate(var(--default-x, 0), var(--default-y, 0))
|
|
139
|
-
rotate(var(--default-r, 0)) scale(var(--default-s, 1));
|
|
140
|
-
z-index: var(--default-z, 0);
|
|
141
|
-
}
|
|
142
|
-
|
|
117
|
+
/* the drag clone flies in/out using its captured offsets */
|
|
143
118
|
.basket-tool-item.next {
|
|
119
|
+
position: absolute;
|
|
144
120
|
transform: translate(var(--next-x, 0), var(--next-y, 0))
|
|
145
121
|
rotate(var(--next-r, 0)) scale(var(--next-s, 1));
|
|
146
122
|
z-index: var(--next-z, 0);
|
|
147
123
|
}
|
|
148
|
-
|
|
149
|
-
/* active & hover */
|
|
150
|
-
.basket-wrapper:hover .basket,
|
|
151
|
-
.basket-wrapper.active .basket {
|
|
152
|
-
z-index: 0;
|
|
153
|
-
}
|
|
154
124
|
.basket-wrapper:hover .basket-tool-item.current,
|
|
155
125
|
.basket-wrapper.active .basket-tool-item.current {
|
|
156
|
-
transform:
|
|
157
|
-
rotate(var(--active-r, 0)) scale(var(--active-s, 1));
|
|
158
|
-
z-index: var(--active-z, 0);
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
.basket-tool-item.next.coming,
|
|
162
|
-
.basket-wrapper:hover .basket-tool-item.current:hover {
|
|
163
|
-
transform: translate(var(--hover-x, 0), var(--hover-y, 0))
|
|
164
|
-
rotate(var(--hover-r, 0)) scale(var(--hover-s, 1));
|
|
165
|
-
z-index: var(--hover-z, 0);
|
|
126
|
+
transform: translateY(-6px) scale(1.06);
|
|
166
127
|
}
|
|
167
128
|
`; }
|
|
168
129
|
get draggableTools() {
|
|
169
|
-
|
|
170
|
-
|
|
130
|
+
// The dedicated "Mind Map" button carries only the mindmap tool; the
|
|
131
|
+
// "Others" button keeps free-text + add-file.
|
|
132
|
+
if (this.variant === 'mindmap') {
|
|
133
|
+
const style = this._style$.value;
|
|
134
|
+
const mindmap = this.mindmaps.find(m => m.style === style) || this.mindmaps[0];
|
|
135
|
+
return [
|
|
136
|
+
{
|
|
137
|
+
name: 'mindmap',
|
|
138
|
+
icon: mindmap.icon,
|
|
139
|
+
config: mindmapConfig,
|
|
140
|
+
standardWidth: 350,
|
|
141
|
+
render: getMindmapRender(style),
|
|
142
|
+
},
|
|
143
|
+
];
|
|
144
|
+
}
|
|
171
145
|
return [
|
|
172
146
|
{
|
|
173
147
|
name: 'media',
|
|
@@ -183,13 +157,6 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
183
157
|
standardWidth: 100,
|
|
184
158
|
render: textRender,
|
|
185
159
|
},
|
|
186
|
-
{
|
|
187
|
-
name: 'mindmap',
|
|
188
|
-
icon: mindmap.icon,
|
|
189
|
-
config: mindmapConfig,
|
|
190
|
-
standardWidth: 350,
|
|
191
|
-
render: getMindmapRender(style),
|
|
192
|
-
},
|
|
193
160
|
];
|
|
194
161
|
}
|
|
195
162
|
get mindmaps() {
|
|
@@ -205,6 +172,7 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
205
172
|
const menu = this.createPopper('edgeless-mindmap-menu', this);
|
|
206
173
|
Object.assign(menu.element, {
|
|
207
174
|
edgeless: this.edgeless,
|
|
175
|
+
variant: this.variant,
|
|
208
176
|
onActiveStyleChange: (style) => {
|
|
209
177
|
this.edgeless.std.get(EditPropsStore).recordLastProps('mindmap', {
|
|
210
178
|
style,
|
|
@@ -228,6 +196,20 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
228
196
|
});
|
|
229
197
|
},
|
|
230
198
|
});
|
|
199
|
+
// Right-align the menu's right edge to this button's right edge, like the
|
|
200
|
+
// framework senior buttons. Stays correct however many buttons are hidden.
|
|
201
|
+
const el = menu.element;
|
|
202
|
+
const wrap = el.parentElement;
|
|
203
|
+
if (wrap) {
|
|
204
|
+
wrap.style.overflow = 'visible';
|
|
205
|
+
wrap.style.justifyContent = 'flex-end';
|
|
206
|
+
}
|
|
207
|
+
Object.assign(el.style, {
|
|
208
|
+
position: 'static',
|
|
209
|
+
width: 'max-content',
|
|
210
|
+
maxWidth: 'calc(100vw - 16px)',
|
|
211
|
+
marginLeft: '0',
|
|
212
|
+
});
|
|
231
213
|
}
|
|
232
214
|
initDragController() {
|
|
233
215
|
if (!this.edgeless || !this.toolbarContainer)
|
|
@@ -291,38 +273,41 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
291
273
|
.catch(console.error);
|
|
292
274
|
},
|
|
293
275
|
});
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
276
|
+
// The `m` shortcut belongs to the dedicated Mind Map button only.
|
|
277
|
+
if (this.variant === 'mindmap') {
|
|
278
|
+
this.edgeless.bindHotKey({
|
|
279
|
+
m: () => {
|
|
280
|
+
const gfx = this.gfx;
|
|
281
|
+
const locked = gfx.viewport.locked;
|
|
282
|
+
if (locked)
|
|
283
|
+
return;
|
|
284
|
+
if (gfx.selection.editing)
|
|
285
|
+
return;
|
|
286
|
+
if (this.readyToDrop) {
|
|
287
|
+
// change the style
|
|
288
|
+
const activeIndex = this.mindmaps.findIndex(m => m.style === this._style$.value);
|
|
289
|
+
const nextIndex = (activeIndex + 1) % this.mindmaps.length;
|
|
290
|
+
const next = this.mindmaps[nextIndex];
|
|
291
|
+
this.edgeless.std.get(EditPropsStore).recordLastProps('mindmap', {
|
|
292
|
+
style: next.style,
|
|
293
|
+
});
|
|
294
|
+
const tool = this.draggableTools.find(t => t.name === 'mindmap');
|
|
295
|
+
this.draggableController.updateElementInfo({
|
|
296
|
+
data: tool,
|
|
297
|
+
preview: next.icon,
|
|
298
|
+
});
|
|
299
|
+
return;
|
|
300
|
+
}
|
|
301
|
+
this.setEdgelessTool(EmptyTool);
|
|
302
|
+
const icon = this.mindmapElement;
|
|
303
|
+
const { x, y } = gfx.tool.lastMouseViewPos$.peek();
|
|
304
|
+
const { viewport } = this.edgeless.std.get(ViewportElementProvider);
|
|
305
|
+
const { left, top } = viewport;
|
|
306
|
+
const clientPos = { x: x + left, y: y + top };
|
|
307
|
+
this.draggableController.dragAndMoveTo(icon, clientPos);
|
|
308
|
+
},
|
|
309
|
+
}, { global: true });
|
|
310
|
+
}
|
|
326
311
|
// since there is not a tool called mindmap, we need to cancel the drag when the tool is changed
|
|
327
312
|
this.disposables.add(this.gfx.tool.currentToolName$.subscribe(toolName => {
|
|
328
313
|
// FIXME: remove the assertion after gfx tool refactor
|
|
@@ -333,15 +318,12 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
333
318
|
}
|
|
334
319
|
render() {
|
|
335
320
|
const { popper } = this;
|
|
336
|
-
const appTheme = this.edgeless.std.get(ThemeProvider).app$.value;
|
|
337
|
-
const basketIcon = appTheme === 'light' ? basketIconLight : basketIconDark;
|
|
338
|
-
const glassBg = appTheme === 'light' ? 'rgba(255,255,255,0.5)' : 'rgba(74, 74, 74, 0.6)';
|
|
339
321
|
const { cancelled, dragOut, draggingElement } = this.draggableController?.states || {};
|
|
340
322
|
const active = popper || draggingElement;
|
|
341
323
|
return html `<edgeless-toolbar-button
|
|
342
324
|
class="edgeless-mindmap-button"
|
|
343
325
|
?withHover=${true}
|
|
344
|
-
.tooltip=${popper ? '' : 'Others'}
|
|
326
|
+
.tooltip=${popper ? '' : this.variant === 'mindmap' ? 'Mind Map' : 'Others'}
|
|
345
327
|
.tooltipOffset=${4}
|
|
346
328
|
@click=${this._toggleMenu}
|
|
347
329
|
style="width: 100%; height: 100%; display: inline-block"
|
|
@@ -389,41 +371,8 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
389
371
|
${tool.icon}
|
|
390
372
|
</div>`;
|
|
391
373
|
})}
|
|
392
|
-
|
|
393
|
-
<div class="basket">
|
|
394
|
-
<div
|
|
395
|
-
class="glass ${this.enableBlur ? 'enabled' : ''}"
|
|
396
|
-
style="background: ${glassBg}"
|
|
397
|
-
></div>
|
|
398
|
-
${basketIcon}
|
|
399
|
-
</div>
|
|
400
374
|
</div>
|
|
401
375
|
</div>
|
|
402
|
-
|
|
403
|
-
<svg width="0" height="0" style="opacity: 0; pointer-events: none">
|
|
404
|
-
<defs>
|
|
405
|
-
<mask id="mindmap-basket-body-mask">
|
|
406
|
-
<rect
|
|
407
|
-
x="2"
|
|
408
|
-
width="71.8"
|
|
409
|
-
y="2"
|
|
410
|
-
height="15"
|
|
411
|
-
rx="1.5"
|
|
412
|
-
ry="1.5"
|
|
413
|
-
fill="white"
|
|
414
|
-
/>
|
|
415
|
-
<rect
|
|
416
|
-
width="32"
|
|
417
|
-
height="6"
|
|
418
|
-
x="22"
|
|
419
|
-
y="5.9"
|
|
420
|
-
fill="black"
|
|
421
|
-
rx="3"
|
|
422
|
-
ry="3"
|
|
423
|
-
/>
|
|
424
|
-
</mask>
|
|
425
|
-
</defs>
|
|
426
|
-
</svg>
|
|
427
376
|
</edgeless-toolbar-button>`;
|
|
428
377
|
}
|
|
429
378
|
updated(_changedProperties) {
|
|
@@ -433,9 +382,11 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
433
382
|
this.initDragController();
|
|
434
383
|
}
|
|
435
384
|
}
|
|
436
|
-
#
|
|
437
|
-
|
|
438
|
-
|
|
385
|
+
#variant_accessor_storage;
|
|
386
|
+
/** `'mindmap'` → the dedicated Mind Map button; `'other'` → free-text +
|
|
387
|
+
* add-file ("Others"). Drives the tools, tooltip, `m` shortcut and menu. */
|
|
388
|
+
get variant() { return this.#variant_accessor_storage; }
|
|
389
|
+
set variant(value) { this.#variant_accessor_storage = value; }
|
|
439
390
|
#mindmapElement_accessor_storage;
|
|
440
391
|
get mindmapElement() { return this.#mindmapElement_accessor_storage; }
|
|
441
392
|
set mindmapElement(value) { this.#mindmapElement_accessor_storage = value; }
|
|
@@ -450,8 +401,8 @@ let EdgelessMindmapToolButton = (() => {
|
|
|
450
401
|
});
|
|
451
402
|
this.enableActiveBackground = true;
|
|
452
403
|
this.type = [EmptyTool, TextTool];
|
|
453
|
-
this.#
|
|
454
|
-
this.#mindmapElement_accessor_storage = (__runInitializers(this,
|
|
404
|
+
this.#variant_accessor_storage = __runInitializers(this, _variant_initializers, 'other');
|
|
405
|
+
this.#mindmapElement_accessor_storage = (__runInitializers(this, _variant_extraInitializers), __runInitializers(this, _mindmapElement_initializers, void 0));
|
|
455
406
|
this.#readyToDrop_accessor_storage = (__runInitializers(this, _mindmapElement_extraInitializers), __runInitializers(this, _readyToDrop_initializers, false));
|
|
456
407
|
__runInitializers(this, _readyToDrop_extraInitializers);
|
|
457
408
|
}
|
|
@@ -6,6 +6,18 @@ export const mindMapSeniorTool = SeniorToolExtension('mindMap', ({ block, toolba
|
|
|
6
6
|
content: html `<edgeless-mindmap-tool-button
|
|
7
7
|
.edgeless=${block}
|
|
8
8
|
.toolbarContainer=${toolbarContainer}
|
|
9
|
+
.variant=${'mindmap'}
|
|
10
|
+
></edgeless-mindmap-tool-button>`,
|
|
11
|
+
};
|
|
12
|
+
});
|
|
13
|
+
/** The "Others" button: free-text + add-file (mindmap moved to its own tool). */
|
|
14
|
+
export const otherSeniorTool = SeniorToolExtension('other', ({ block, toolbarContainer }) => {
|
|
15
|
+
return {
|
|
16
|
+
name: 'Others',
|
|
17
|
+
content: html `<edgeless-mindmap-tool-button
|
|
18
|
+
.edgeless=${block}
|
|
19
|
+
.toolbarContainer=${toolbarContainer}
|
|
20
|
+
.variant=${'other'}
|
|
9
21
|
></edgeless-mindmap-tool-button>`,
|
|
10
22
|
};
|
|
11
23
|
});
|
|
@@ -1,6 +1,22 @@
|
|
|
1
1
|
import { type ViewExtensionContext, ViewExtensionProvider } from '../affine-ext-loader/index.js';
|
|
2
|
-
|
|
2
|
+
/**
|
|
3
|
+
* Mindmap rendering — ALWAYS registered, independent of any flag. Disabling the
|
|
4
|
+
* `mindmap` / `other` flags hides only their senior buttons (see below); placed
|
|
5
|
+
* mindmaps must still paint, stay editable, and Templates-panel insertion must
|
|
6
|
+
* still render them.
|
|
7
|
+
*/
|
|
8
|
+
export declare class MindmapRenderViewExtension extends ViewExtensionProvider {
|
|
3
9
|
name: string;
|
|
4
10
|
effect(): void;
|
|
5
11
|
setup(context: ViewExtensionContext): void;
|
|
6
12
|
}
|
|
13
|
+
/** The dedicated "Mind Map" senior button — flag-gated (`mindmap`). */
|
|
14
|
+
export declare class MindmapToolViewExtension extends ViewExtensionProvider {
|
|
15
|
+
name: string;
|
|
16
|
+
setup(context: ViewExtensionContext): void;
|
|
17
|
+
}
|
|
18
|
+
/** The "Others" senior button (free-text + add-file) — flag-gated (`other`). */
|
|
19
|
+
export declare class OtherToolViewExtension extends ViewExtensionProvider {
|
|
20
|
+
name: string;
|
|
21
|
+
setup(context: ViewExtensionContext): void;
|
|
22
|
+
}
|
|
@@ -1,24 +1,32 @@
|
|
|
1
1
|
import { ViewExtensionProvider, } from '../affine-ext-loader/index.js';
|
|
2
|
+
import { extendTemplateCategory } from '../affine-gfx-template/index.js';
|
|
2
3
|
import { effects } from './effects';
|
|
3
4
|
import { MindmapElementRendererExtension } from './element-renderer';
|
|
4
5
|
import { MindMapIndicatorOverlay } from './indicator-overlay';
|
|
5
6
|
import { MindMapDragExtension } from './interactivity';
|
|
6
7
|
import { mindmapToolbarExtension, shapeMindmapToolbarExtension, } from './toolbar/config';
|
|
7
|
-
import { mindMapSeniorTool } from './toolbar/senior-tool';
|
|
8
|
+
import { mindMapSeniorTool, otherSeniorTool } from './toolbar/senior-tool';
|
|
9
|
+
import { mindmapTemplateCategory } from './templates';
|
|
8
10
|
import { MindMapInteraction, MindMapView } from './view/view';
|
|
9
|
-
|
|
11
|
+
/**
|
|
12
|
+
* Mindmap rendering — ALWAYS registered, independent of any flag. Disabling the
|
|
13
|
+
* `mindmap` / `other` flags hides only their senior buttons (see below); placed
|
|
14
|
+
* mindmaps must still paint, stay editable, and Templates-panel insertion must
|
|
15
|
+
* still render them.
|
|
16
|
+
*/
|
|
17
|
+
export class MindmapRenderViewExtension extends ViewExtensionProvider {
|
|
10
18
|
constructor() {
|
|
11
19
|
super(...arguments);
|
|
12
|
-
this.name = 'affine-mindmap-gfx';
|
|
20
|
+
this.name = 'affine-mindmap-render-gfx';
|
|
13
21
|
}
|
|
14
22
|
effect() {
|
|
15
23
|
super.effect();
|
|
16
24
|
effects();
|
|
25
|
+
extendTemplateCategory(mindmapTemplateCategory);
|
|
17
26
|
}
|
|
18
27
|
setup(context) {
|
|
19
28
|
super.setup(context);
|
|
20
29
|
context.register(MindmapElementRendererExtension);
|
|
21
|
-
context.register(mindMapSeniorTool);
|
|
22
30
|
context.register(mindmapToolbarExtension);
|
|
23
31
|
context.register(shapeMindmapToolbarExtension);
|
|
24
32
|
context.register(MindMapView);
|
|
@@ -27,3 +35,29 @@ export class MindmapViewExtension extends ViewExtensionProvider {
|
|
|
27
35
|
context.register(MindMapInteraction);
|
|
28
36
|
}
|
|
29
37
|
}
|
|
38
|
+
/** The dedicated "Mind Map" senior button — flag-gated (`mindmap`). */
|
|
39
|
+
export class MindmapToolViewExtension extends ViewExtensionProvider {
|
|
40
|
+
constructor() {
|
|
41
|
+
super(...arguments);
|
|
42
|
+
this.name = 'affine-mindmap-gfx';
|
|
43
|
+
}
|
|
44
|
+
setup(context) {
|
|
45
|
+
super.setup(context);
|
|
46
|
+
if (this.isEdgeless(context.scope)) {
|
|
47
|
+
context.register(mindMapSeniorTool);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
/** The "Others" senior button (free-text + add-file) — flag-gated (`other`). */
|
|
52
|
+
export class OtherToolViewExtension extends ViewExtensionProvider {
|
|
53
|
+
constructor() {
|
|
54
|
+
super(...arguments);
|
|
55
|
+
this.name = 'affine-other-gfx';
|
|
56
|
+
}
|
|
57
|
+
setup(context) {
|
|
58
|
+
super.setup(context);
|
|
59
|
+
if (this.isEdgeless(context.scope)) {
|
|
60
|
+
context.register(otherSeniorTool);
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
}
|
|
@@ -35,7 +35,7 @@ export const replaceIdMiddleware = (job) => {
|
|
|
35
35
|
regeneratedIdMap.set(id, newId);
|
|
36
36
|
val.id = newId;
|
|
37
37
|
elements[newId] = val;
|
|
38
|
-
if (['connector', 'group'].includes(val['type'])) {
|
|
38
|
+
if (['connector', 'group', 'mindmap'].includes(val['type'])) {
|
|
39
39
|
defered.push(newId);
|
|
40
40
|
}
|
|
41
41
|
});
|
|
@@ -73,6 +73,21 @@ export const replaceIdMiddleware = (job) => {
|
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
75
|
break;
|
|
76
|
+
case 'mindmap':
|
|
77
|
+
{
|
|
78
|
+
const children = element['children'];
|
|
79
|
+
const newJson = {};
|
|
80
|
+
Object.entries(children.json).forEach(([key, val]) => {
|
|
81
|
+
const newVal = { ...val };
|
|
82
|
+
if (newVal.parent) {
|
|
83
|
+
newVal.parent =
|
|
84
|
+
regeneratedIdMap.get(newVal.parent) ?? newVal.parent;
|
|
85
|
+
}
|
|
86
|
+
newJson[regeneratedIdMap.get(key) ?? key] = newVal;
|
|
87
|
+
});
|
|
88
|
+
children.json = newJson;
|
|
89
|
+
}
|
|
90
|
+
break;
|
|
76
91
|
}
|
|
77
92
|
});
|
|
78
93
|
blockJson.props.elements = elements;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import type { IVec, SerializedXYWH } from '../../../global/gfx/index.js';
|
|
2
|
+
import { Bound } from '../../../global/gfx/index.js';
|
|
3
|
+
import type { BaseElementProps } from '../../../std/gfx/index.js';
|
|
4
|
+
import { GfxPrimitiveElementModel } from '../../../std/gfx/index.js';
|
|
5
|
+
export type CoreDomainChartProps = BaseElementProps & {
|
|
6
|
+
/** When false the resize handles are hidden — toggled from the toolbar. */
|
|
7
|
+
resizeEnabled?: boolean;
|
|
8
|
+
/** When false the translucent Core / Supporting / Generic zone bands are hidden. */
|
|
9
|
+
showZones?: boolean;
|
|
10
|
+
/** When false the axis titles, Low/High ticks and zone names are hidden. */
|
|
11
|
+
showLabels?: boolean;
|
|
12
|
+
};
|
|
13
|
+
/**
|
|
14
|
+
* The Core Domain Chart background (DDD Crew): the two axes (Complexity ×
|
|
15
|
+
* Business differentiation) with their Low/High ticks and the translucent
|
|
16
|
+
* Generic / Supporting / Core zone bands. The user places sub-domain dots,
|
|
17
|
+
* movement arrows and the Notation legend on top of it.
|
|
18
|
+
*
|
|
19
|
+
* Mirrors the Wardley / EDGY / Cynefin backgrounds: extends
|
|
20
|
+
* {@link GfxPrimitiveElementModel} so it inherits selection, move, copy/paste,
|
|
21
|
+
* duplicate, align and undo/redo. Authored in a fixed reference space and scaled
|
|
22
|
+
* uniformly to the element bounds by the renderer.
|
|
23
|
+
*/
|
|
24
|
+
export declare class CoreDomainChartElementModel extends GfxPrimitiveElementModel<CoreDomainChartProps> {
|
|
25
|
+
get type(): string;
|
|
26
|
+
get connectable(): boolean;
|
|
27
|
+
containsBound(bounds: Bound): boolean;
|
|
28
|
+
getLineIntersections(start: IVec, end: IVec): import("../../../global/gfx/index.js").PointLocation[] | null;
|
|
29
|
+
getNearestPoint(point: IVec): IVec;
|
|
30
|
+
includesPoint(x: number, y: number): boolean;
|
|
31
|
+
accessor resizeEnabled: boolean;
|
|
32
|
+
accessor showZones: boolean;
|
|
33
|
+
accessor showLabels: boolean;
|
|
34
|
+
accessor rotate: number;
|
|
35
|
+
accessor xywh: SerializedXYWH;
|
|
36
|
+
}
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
|
|
2
|
+
function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
|
|
3
|
+
var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
|
|
4
|
+
var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
|
|
5
|
+
var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
|
|
6
|
+
var _, done = false;
|
|
7
|
+
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
8
|
+
var context = {};
|
|
9
|
+
for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
|
|
10
|
+
for (var p in contextIn.access) context.access[p] = contextIn.access[p];
|
|
11
|
+
context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
|
|
12
|
+
var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
|
|
13
|
+
if (kind === "accessor") {
|
|
14
|
+
if (result === void 0) continue;
|
|
15
|
+
if (result === null || typeof result !== "object") throw new TypeError("Object expected");
|
|
16
|
+
if (_ = accept(result.get)) descriptor.get = _;
|
|
17
|
+
if (_ = accept(result.set)) descriptor.set = _;
|
|
18
|
+
if (_ = accept(result.init)) initializers.unshift(_);
|
|
19
|
+
}
|
|
20
|
+
else if (_ = accept(result)) {
|
|
21
|
+
if (kind === "field") initializers.unshift(_);
|
|
22
|
+
else descriptor[key] = _;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
if (target) Object.defineProperty(target, contextIn.name, descriptor);
|
|
26
|
+
done = true;
|
|
27
|
+
};
|
|
28
|
+
var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
|
|
29
|
+
var useValue = arguments.length > 2;
|
|
30
|
+
for (var i = 0; i < initializers.length; i++) {
|
|
31
|
+
value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
|
|
32
|
+
}
|
|
33
|
+
return useValue ? value : void 0;
|
|
34
|
+
};
|
|
35
|
+
import { Bound, getPointsFromBoundWithRotation, linePolygonIntersects, pointInPolygon, polygonNearestPoint, } from '../../../global/gfx/index.js';
|
|
36
|
+
import { field, GfxPrimitiveElementModel } from '../../../std/gfx/index.js';
|
|
37
|
+
/**
|
|
38
|
+
* The Core Domain Chart background (DDD Crew): the two axes (Complexity ×
|
|
39
|
+
* Business differentiation) with their Low/High ticks and the translucent
|
|
40
|
+
* Generic / Supporting / Core zone bands. The user places sub-domain dots,
|
|
41
|
+
* movement arrows and the Notation legend on top of it.
|
|
42
|
+
*
|
|
43
|
+
* Mirrors the Wardley / EDGY / Cynefin backgrounds: extends
|
|
44
|
+
* {@link GfxPrimitiveElementModel} so it inherits selection, move, copy/paste,
|
|
45
|
+
* duplicate, align and undo/redo. Authored in a fixed reference space and scaled
|
|
46
|
+
* uniformly to the element bounds by the renderer.
|
|
47
|
+
*/
|
|
48
|
+
let CoreDomainChartElementModel = (() => {
|
|
49
|
+
let _classSuper = GfxPrimitiveElementModel;
|
|
50
|
+
let _resizeEnabled_decorators;
|
|
51
|
+
let _resizeEnabled_initializers = [];
|
|
52
|
+
let _resizeEnabled_extraInitializers = [];
|
|
53
|
+
let _showZones_decorators;
|
|
54
|
+
let _showZones_initializers = [];
|
|
55
|
+
let _showZones_extraInitializers = [];
|
|
56
|
+
let _showLabels_decorators;
|
|
57
|
+
let _showLabels_initializers = [];
|
|
58
|
+
let _showLabels_extraInitializers = [];
|
|
59
|
+
let _rotate_decorators;
|
|
60
|
+
let _rotate_initializers = [];
|
|
61
|
+
let _rotate_extraInitializers = [];
|
|
62
|
+
let _xywh_decorators;
|
|
63
|
+
let _xywh_initializers = [];
|
|
64
|
+
let _xywh_extraInitializers = [];
|
|
65
|
+
return class CoreDomainChartElementModel extends _classSuper {
|
|
66
|
+
static {
|
|
67
|
+
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
68
|
+
_resizeEnabled_decorators = [field(true)];
|
|
69
|
+
_showZones_decorators = [field(true)];
|
|
70
|
+
_showLabels_decorators = [field(true)];
|
|
71
|
+
_rotate_decorators = [field(0)];
|
|
72
|
+
_xywh_decorators = [field()];
|
|
73
|
+
__esDecorate(this, null, _resizeEnabled_decorators, { kind: "accessor", name: "resizeEnabled", static: false, private: false, access: { has: obj => "resizeEnabled" in obj, get: obj => obj.resizeEnabled, set: (obj, value) => { obj.resizeEnabled = value; } }, metadata: _metadata }, _resizeEnabled_initializers, _resizeEnabled_extraInitializers);
|
|
74
|
+
__esDecorate(this, null, _showZones_decorators, { kind: "accessor", name: "showZones", static: false, private: false, access: { has: obj => "showZones" in obj, get: obj => obj.showZones, set: (obj, value) => { obj.showZones = value; } }, metadata: _metadata }, _showZones_initializers, _showZones_extraInitializers);
|
|
75
|
+
__esDecorate(this, null, _showLabels_decorators, { kind: "accessor", name: "showLabels", static: false, private: false, access: { has: obj => "showLabels" in obj, get: obj => obj.showLabels, set: (obj, value) => { obj.showLabels = value; } }, metadata: _metadata }, _showLabels_initializers, _showLabels_extraInitializers);
|
|
76
|
+
__esDecorate(this, null, _rotate_decorators, { kind: "accessor", name: "rotate", static: false, private: false, access: { has: obj => "rotate" in obj, get: obj => obj.rotate, set: (obj, value) => { obj.rotate = value; } }, metadata: _metadata }, _rotate_initializers, _rotate_extraInitializers);
|
|
77
|
+
__esDecorate(this, null, _xywh_decorators, { kind: "accessor", name: "xywh", static: false, private: false, access: { has: obj => "xywh" in obj, get: obj => obj.xywh, set: (obj, value) => { obj.xywh = value; } }, metadata: _metadata }, _xywh_initializers, _xywh_extraInitializers);
|
|
78
|
+
if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
79
|
+
}
|
|
80
|
+
get type() {
|
|
81
|
+
return 'coreDomain';
|
|
82
|
+
}
|
|
83
|
+
get connectable() {
|
|
84
|
+
return false;
|
|
85
|
+
}
|
|
86
|
+
containsBound(bounds) {
|
|
87
|
+
const points = getPointsFromBoundWithRotation(this);
|
|
88
|
+
return points.some(point => bounds.containsPoint(point));
|
|
89
|
+
}
|
|
90
|
+
getLineIntersections(start, end) {
|
|
91
|
+
const points = getPointsFromBoundWithRotation(this);
|
|
92
|
+
return linePolygonIntersects(start, end, points);
|
|
93
|
+
}
|
|
94
|
+
getNearestPoint(point) {
|
|
95
|
+
return polygonNearestPoint(Bound.deserialize(this.xywh).points, point);
|
|
96
|
+
}
|
|
97
|
+
includesPoint(x, y) {
|
|
98
|
+
const points = getPointsFromBoundWithRotation(this);
|
|
99
|
+
return pointInPolygon([x, y], points);
|
|
100
|
+
}
|
|
101
|
+
#resizeEnabled_accessor_storage = __runInitializers(this, _resizeEnabled_initializers, true);
|
|
102
|
+
get resizeEnabled() { return this.#resizeEnabled_accessor_storage; }
|
|
103
|
+
set resizeEnabled(value) { this.#resizeEnabled_accessor_storage = value; }
|
|
104
|
+
#showZones_accessor_storage = (__runInitializers(this, _resizeEnabled_extraInitializers), __runInitializers(this, _showZones_initializers, true));
|
|
105
|
+
get showZones() { return this.#showZones_accessor_storage; }
|
|
106
|
+
set showZones(value) { this.#showZones_accessor_storage = value; }
|
|
107
|
+
#showLabels_accessor_storage = (__runInitializers(this, _showZones_extraInitializers), __runInitializers(this, _showLabels_initializers, true));
|
|
108
|
+
get showLabels() { return this.#showLabels_accessor_storage; }
|
|
109
|
+
set showLabels(value) { this.#showLabels_accessor_storage = value; }
|
|
110
|
+
#rotate_accessor_storage = (__runInitializers(this, _showLabels_extraInitializers), __runInitializers(this, _rotate_initializers, 0));
|
|
111
|
+
get rotate() { return this.#rotate_accessor_storage; }
|
|
112
|
+
set rotate(value) { this.#rotate_accessor_storage = value; }
|
|
113
|
+
#xywh_accessor_storage = (__runInitializers(this, _rotate_extraInitializers), __runInitializers(this, _xywh_initializers, '[0,0,900,820]'));
|
|
114
|
+
get xywh() { return this.#xywh_accessor_storage; }
|
|
115
|
+
set xywh(value) { this.#xywh_accessor_storage = value; }
|
|
116
|
+
constructor() {
|
|
117
|
+
super(...arguments);
|
|
118
|
+
__runInitializers(this, _xywh_extraInitializers);
|
|
119
|
+
}
|
|
120
|
+
};
|
|
121
|
+
})();
|
|
122
|
+
export { CoreDomainChartElementModel };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './core-domain.js';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './core-domain.js';
|
|
@@ -2,6 +2,7 @@ import type { EdgelessTextBlockModel } from '../blocks/edgeless-text/edgeless-te
|
|
|
2
2
|
import type { BpmnNodeElementModel, BpmnPoolElementModel } from './bpmn/index.js';
|
|
3
3
|
import type { BrushElementModel } from './brush/index.js';
|
|
4
4
|
import type { ConnectorElementModel } from './connector/index.js';
|
|
5
|
+
import type { CoreDomainChartElementModel } from './core-domain/index.js';
|
|
5
6
|
import type { EdgyFacetsElementModel, EdgyNodeElementModel } from './edgy/index.js';
|
|
6
7
|
import type { CynefinElementModel } from './cynefin/index.js';
|
|
7
8
|
import type { EstuarineElementModel } from './estuarine/index.js';
|
|
@@ -14,6 +15,7 @@ import type { WardleyBackgroundElementModel, WardleyNodeElementModel } from './w
|
|
|
14
15
|
export * from './bpmn/index.js';
|
|
15
16
|
export * from './brush/index.js';
|
|
16
17
|
export * from './connector/index.js';
|
|
18
|
+
export * from './core-domain/index.js';
|
|
17
19
|
export * from './cynefin/index.js';
|
|
18
20
|
export * from './edgy/index.js';
|
|
19
21
|
export * from './estuarine/index.js';
|
|
@@ -39,6 +41,7 @@ export type SurfaceElementModelMap = {
|
|
|
39
41
|
edgyNode: EdgyNodeElementModel;
|
|
40
42
|
cynefin: CynefinElementModel;
|
|
41
43
|
estuarine: EstuarineElementModel;
|
|
44
|
+
coreDomain: CoreDomainChartElementModel;
|
|
42
45
|
};
|
|
43
46
|
export type SurfaceTextModelMap = {
|
|
44
47
|
text: TextElementModel;
|
|
@@ -33,7 +33,7 @@ export type BlockLifecycleEvents = {
|
|
|
33
33
|
* manipulated ('background:classic', 'node:market', 'connector:link'…).
|
|
34
34
|
*/
|
|
35
35
|
export interface FrameworkElementEvent extends TelemetryEvent {
|
|
36
|
-
framework: 'wardley' | 'edgy' | 'cynefin' | 'bpmn';
|
|
36
|
+
framework: 'wardley' | 'edgy' | 'cynefin' | 'bpmn' | 'event-storming' | 'core-domain' | 'context-map';
|
|
37
37
|
element: string;
|
|
38
38
|
}
|
|
39
39
|
export type FrameworkDiagramEvents = {
|
package/dist/extensions/view.js
CHANGED
|
@@ -27,7 +27,7 @@ import { BrushViewExtension } from '../_pkgs/affine-gfx-brush/view.js';
|
|
|
27
27
|
import { ConnectorViewExtension } from '../_pkgs/affine-gfx-connector/view.js';
|
|
28
28
|
import { GroupViewExtension } from '../_pkgs/affine-gfx-group/view.js';
|
|
29
29
|
import { LinkViewExtension as GfxLinkViewExtension } from '../_pkgs/affine-gfx-link/view.js';
|
|
30
|
-
import {
|
|
30
|
+
import { MindmapRenderViewExtension, MindmapToolViewExtension, OtherToolViewExtension, } from '../_pkgs/affine-gfx-mindmap/view.js';
|
|
31
31
|
import { NoteViewExtension as GfxNoteViewExtension } from '../_pkgs/affine-gfx-note/view.js';
|
|
32
32
|
import { PointerViewExtension } from '../_pkgs/affine-gfx-pointer/view.js';
|
|
33
33
|
import { ShapeViewExtension } from '../_pkgs/affine-gfx-shape/view.js';
|
|
@@ -70,12 +70,16 @@ export function getInternalViewExtensions(flags) {
|
|
|
70
70
|
GfxNoteViewExtension,
|
|
71
71
|
...(on('brush') ? [BrushViewExtension] : []),
|
|
72
72
|
ShapeViewExtension,
|
|
73
|
-
|
|
73
|
+
// Mindmap rendering is always on; the flags gate only the senior buttons.
|
|
74
|
+
MindmapRenderViewExtension,
|
|
75
|
+
...(on('mindmap') ? [MindmapToolViewExtension] : []),
|
|
76
|
+
...(on('other') ? [OtherToolViewExtension] : []),
|
|
74
77
|
ConnectorViewExtension,
|
|
75
78
|
GroupViewExtension,
|
|
76
79
|
TextViewExtension,
|
|
77
80
|
...(on('template') ? [TemplateViewExtension] : []),
|
|
78
81
|
...(on('link') ? [GfxLinkViewExtension] : []),
|
|
82
|
+
// Core Domain rendering is always on; the flag gates only the senior button.
|
|
79
83
|
// Block
|
|
80
84
|
...(on('attachment') ? [AttachmentViewExtension] : []),
|
|
81
85
|
...(on('bookmark') ? [BookmarkViewExtension] : []),
|
package/dist/flags.d.ts
CHANGED
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
* - `latex` controls both the latex block and inline latex.
|
|
24
24
|
* - `frame` also controls the frame panel fragment.
|
|
25
25
|
*/
|
|
26
|
-
export declare const OPTIONAL_BLOCKS: readonly ["attachment", "bookmark", "callout", "code", "data-view", "database", "divider", "edgeless-text", "embed", "embed-doc", "frame", "image", "latex", "list", "surface-ref", "table", "brush", "mindmap", "template", "link"];
|
|
26
|
+
export declare const OPTIONAL_BLOCKS: readonly ["attachment", "bookmark", "callout", "code", "data-view", "database", "divider", "edgeless-text", "embed", "embed-doc", "frame", "image", "latex", "list", "surface-ref", "table", "brush", "mindmap", "other", "template", "link"];
|
|
27
27
|
export type OptionalBlock = (typeof OPTIONAL_BLOCKS)[number];
|
|
28
28
|
/** Map of optional block -> enabled. Missing keys default to enabled. */
|
|
29
29
|
export type BlockFlags = Partial<Record<OptionalBlock, boolean>>;
|
package/dist/flags.js
CHANGED