@formicoidea/labre-framework-wardley 0.23.1 → 0.23.3

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.
Files changed (47) hide show
  1. package/dist/consts.d.ts +0 -1
  2. package/dist/consts.js +0 -1
  3. package/dist/descriptor.d.ts +4 -4
  4. package/dist/descriptor.js +3 -4
  5. package/dist/effects.d.ts +0 -1
  6. package/dist/effects.js +0 -1
  7. package/dist/element-renderer.d.ts +1 -2
  8. package/dist/element-renderer.js +0 -1
  9. package/dist/element-view.d.ts +0 -1
  10. package/dist/element-view.js +0 -1
  11. package/dist/gradient.d.ts +0 -1
  12. package/dist/gradient.js +0 -1
  13. package/dist/index.d.ts +0 -1
  14. package/dist/index.js +0 -1
  15. package/dist/label-layout.d.ts +0 -1
  16. package/dist/label-layout.js +0 -1
  17. package/dist/legend.d.ts +0 -1
  18. package/dist/legend.js +0 -1
  19. package/dist/node/consts.d.ts +0 -1
  20. package/dist/node/consts.js +0 -1
  21. package/dist/node/node-renderer.d.ts +1 -2
  22. package/dist/node/node-renderer.js +0 -1
  23. package/dist/node/node-view.d.ts +0 -1
  24. package/dist/node/node-view.js +0 -1
  25. package/dist/templates/index.d.ts +0 -1
  26. package/dist/templates/index.js +0 -1
  27. package/dist/templates/maps.d.ts +0 -1
  28. package/dist/templates/maps.js +0 -1
  29. package/dist/toolbar/config.d.ts +0 -1
  30. package/dist/toolbar/config.js +101 -102
  31. package/dist/toolbar/icons.d.ts +0 -1
  32. package/dist/toolbar/icons.js +0 -1
  33. package/dist/toolbar/node-config.d.ts +0 -1
  34. package/dist/toolbar/node-config.js +0 -1
  35. package/dist/toolbar/senior-tool.d.ts +0 -1
  36. package/dist/toolbar/senior-tool.js +2 -3
  37. package/dist/toolbar/wardley-menu.d.ts +1 -2
  38. package/dist/toolbar/wardley-menu.js +106 -107
  39. package/dist/toolbar/wardley-senior-button.d.ts +1 -2
  40. package/dist/toolbar/wardley-senior-button.js +56 -57
  41. package/dist/view.d.ts +0 -1
  42. package/dist/view.js +0 -1
  43. package/package.json +2 -2
  44. package/dist/node/label-editor.d.ts +0 -28
  45. package/dist/node/label-editor.js +0 -216
  46. package/dist/toolbar/wardley-tool-button.d.ts +0 -10
  47. package/dist/toolbar/wardley-tool-button.js +0 -123
@@ -61,27 +61,27 @@ export class EdgelessWardleyMenu extends EdgelessToolbarToolMixin(LitElement) {
61
61
  super(...arguments);
62
62
  this.type = EmptyTool;
63
63
  }
64
- static { this.styles = css `
65
- :host {
66
- position: absolute;
67
- display: flex;
68
- z-index: -1;
69
- }
70
- .menu-content {
71
- display: flex;
72
- align-items: center;
73
- justify-content: center;
74
- }
75
- .button-group-container {
76
- display: flex;
77
- align-items: center;
78
- gap: 14px;
79
- fill: var(--affine-icon-color);
80
- }
81
- .button-group-container svg {
82
- width: 24px;
83
- height: 24px;
84
- }
64
+ static { this.styles = css `
65
+ :host {
66
+ position: absolute;
67
+ display: flex;
68
+ z-index: -1;
69
+ }
70
+ .menu-content {
71
+ display: flex;
72
+ align-items: center;
73
+ justify-content: center;
74
+ }
75
+ .button-group-container {
76
+ display: flex;
77
+ align-items: center;
78
+ gap: 14px;
79
+ fill: var(--affine-icon-color);
80
+ }
81
+ .button-group-container svg {
82
+ width: 24px;
83
+ height: 24px;
84
+ }
85
85
  `; }
86
86
  _createBackground(variant = 'classic') {
87
87
  const { gfx } = this;
@@ -317,92 +317,91 @@ export class EdgelessWardleyMenu extends EdgelessToolbarToolMixin(LitElement) {
317
317
  });
318
318
  }
319
319
  render() {
320
- return html `
321
- <edgeless-slide-menu>
322
- <div class="menu-content">
323
- <div class="button-group-container">
324
- <edgeless-tool-icon-button
325
- .tooltip=${'Wardley map background'}
326
- @click=${() => this._createBackground('classic')}
327
- >
328
- ${wardleyBackgroundIcon}
329
- </edgeless-tool-icon-button>
330
- <edgeless-tool-icon-button
331
- .tooltip=${'Opportunity background (gradient)'}
332
- @click=${() => this._createBackground('opportunity')}
333
- >
334
- ${wardleyOpportunityIcon}
335
- </edgeless-tool-icon-button>
336
- <edgeless-tool-icon-button
337
- .tooltip=${'Benefit / Investment background (gradient)'}
338
- @click=${() => this._createBackground('benefit')}
339
- >
340
- ${wardleyBenefitIcon}
341
- </edgeless-tool-icon-button>
342
- <edgeless-tool-icon-button
343
- .tooltip=${'Evolution background (Wardley presentation)'}
344
- @click=${() => this._createBackground('evolution-gradient')}
345
- >
346
- ${wardleyEvolutionGradientIcon}
347
- </edgeless-tool-icon-button>
348
- <edgeless-tool-icon-button
349
- .tooltip=${'Component'}
350
- @click=${() => this._createNode('component')}
351
- >
352
- ${wardleyComponentIcon}
353
- </edgeless-tool-icon-button>
354
- <edgeless-tool-icon-button
355
- .tooltip=${'Component + method'}
356
- @click=${() => this._createNode('method')}
357
- >
358
- ${wardleyMethodIcon}
359
- </edgeless-tool-icon-button>
360
- <edgeless-tool-icon-button
361
- .tooltip=${'Market'}
362
- @click=${this._createMarket}
363
- >
364
- ${wardleyMarketIcon}
365
- </edgeless-tool-icon-button>
366
- <edgeless-tool-icon-button
367
- .tooltip=${'Ecosystem'}
368
- @click=${() => this._createNode('ecosystem')}
369
- >
370
- ${wardleyEcosystemIcon}
371
- </edgeless-tool-icon-button>
372
- <edgeless-tool-icon-button
373
- .tooltip=${'Anchor'}
374
- @click=${() => this._createNode('anchor')}
375
- >
376
- ${wardleyAnchorIcon}
377
- </edgeless-tool-icon-button>
378
- <edgeless-tool-icon-button
379
- .tooltip=${'Pipeline'}
380
- @click=${this._createPipeline}
381
- >
382
- ${wardleyPipelineIcon}
383
- </edgeless-tool-icon-button>
384
- <edgeless-tool-icon-button
385
- .tooltip=${'Link'}
386
- @click=${() => this._activateConnector('link')}
387
- >
388
- ${wardleyLinkIcon}
389
- </edgeless-tool-icon-button>
390
- <edgeless-tool-icon-button
391
- .tooltip=${'Arrow (evolution)'}
392
- @click=${() => this._activateConnector('arrow')}
393
- >
394
- ${wardleyArrowIcon}
395
- </edgeless-tool-icon-button>
396
- <edgeless-tool-icon-button
397
- .tooltip=${'Inertia'}
398
- @click=${this._createInertia}
399
- >
400
- ${wardleyInertiaIcon}
401
- </edgeless-tool-icon-button>
402
- </div>
403
- </div>
404
- </edgeless-slide-menu>
320
+ return html `
321
+ <edgeless-slide-menu>
322
+ <div class="menu-content">
323
+ <div class="button-group-container">
324
+ <edgeless-tool-icon-button
325
+ .tooltip=${'Wardley map background'}
326
+ @click=${() => this._createBackground('classic')}
327
+ >
328
+ ${wardleyBackgroundIcon}
329
+ </edgeless-tool-icon-button>
330
+ <edgeless-tool-icon-button
331
+ .tooltip=${'Opportunity background (gradient)'}
332
+ @click=${() => this._createBackground('opportunity')}
333
+ >
334
+ ${wardleyOpportunityIcon}
335
+ </edgeless-tool-icon-button>
336
+ <edgeless-tool-icon-button
337
+ .tooltip=${'Benefit / Investment background (gradient)'}
338
+ @click=${() => this._createBackground('benefit')}
339
+ >
340
+ ${wardleyBenefitIcon}
341
+ </edgeless-tool-icon-button>
342
+ <edgeless-tool-icon-button
343
+ .tooltip=${'Evolution background (Wardley presentation)'}
344
+ @click=${() => this._createBackground('evolution-gradient')}
345
+ >
346
+ ${wardleyEvolutionGradientIcon}
347
+ </edgeless-tool-icon-button>
348
+ <edgeless-tool-icon-button
349
+ .tooltip=${'Component'}
350
+ @click=${() => this._createNode('component')}
351
+ >
352
+ ${wardleyComponentIcon}
353
+ </edgeless-tool-icon-button>
354
+ <edgeless-tool-icon-button
355
+ .tooltip=${'Component + method'}
356
+ @click=${() => this._createNode('method')}
357
+ >
358
+ ${wardleyMethodIcon}
359
+ </edgeless-tool-icon-button>
360
+ <edgeless-tool-icon-button
361
+ .tooltip=${'Market'}
362
+ @click=${this._createMarket}
363
+ >
364
+ ${wardleyMarketIcon}
365
+ </edgeless-tool-icon-button>
366
+ <edgeless-tool-icon-button
367
+ .tooltip=${'Ecosystem'}
368
+ @click=${() => this._createNode('ecosystem')}
369
+ >
370
+ ${wardleyEcosystemIcon}
371
+ </edgeless-tool-icon-button>
372
+ <edgeless-tool-icon-button
373
+ .tooltip=${'Anchor'}
374
+ @click=${() => this._createNode('anchor')}
375
+ >
376
+ ${wardleyAnchorIcon}
377
+ </edgeless-tool-icon-button>
378
+ <edgeless-tool-icon-button
379
+ .tooltip=${'Pipeline'}
380
+ @click=${this._createPipeline}
381
+ >
382
+ ${wardleyPipelineIcon}
383
+ </edgeless-tool-icon-button>
384
+ <edgeless-tool-icon-button
385
+ .tooltip=${'Link'}
386
+ @click=${() => this._activateConnector('link')}
387
+ >
388
+ ${wardleyLinkIcon}
389
+ </edgeless-tool-icon-button>
390
+ <edgeless-tool-icon-button
391
+ .tooltip=${'Arrow (evolution)'}
392
+ @click=${() => this._activateConnector('arrow')}
393
+ >
394
+ ${wardleyArrowIcon}
395
+ </edgeless-tool-icon-button>
396
+ <edgeless-tool-icon-button
397
+ .tooltip=${'Inertia'}
398
+ @click=${this._createInertia}
399
+ >
400
+ ${wardleyInertiaIcon}
401
+ </edgeless-tool-icon-button>
402
+ </div>
403
+ </div>
404
+ </edgeless-slide-menu>
405
405
  `;
406
406
  }
407
407
  }
408
- //# sourceMappingURL=wardley-menu.js.map
@@ -1,6 +1,6 @@
1
1
  import { EmptyTool } from '@formicoidea/labre-core/gfx/pointer';
2
2
  import { LitElement } from 'lit';
3
- declare const EdgelessWardleySeniorButton_base: typeof LitElement & import("@formicoidea/labre-core/global/utils").Constructor<import("@formicoidea/labre-core/widgets/edgeless-toolbar").EdgelessToolbarToolClass>;
3
+ declare const EdgelessWardleySeniorButton_base: typeof LitElement & import("@formicoidea/labre-core/_pkgs/global/utils").Constructor<import("@formicoidea/labre-core/_pkgs/affine-widget-edgeless-toolbar").EdgelessToolbarToolClass>;
4
4
  /**
5
5
  * Main toolbar button (colored proposal-B icon) that opens the Wardley toolbox
6
6
  * sub-menu above the toolbar. Styled like the other senior tools: the tile fills
@@ -15,4 +15,3 @@ export declare class EdgelessWardleySeniorButton extends EdgelessWardleySeniorBu
15
15
  render(): import("lit-html").TemplateResult<1>;
16
16
  }
17
17
  export {};
18
- //# sourceMappingURL=wardley-senior-button.d.ts.map
@@ -20,52 +20,52 @@ export class EdgelessWardleySeniorButton extends EdgelessToolbarToolMixin(Signal
20
20
  // native Note/Shape sub-menus.
21
21
  this.type = EmptyTool;
22
22
  }
23
- static { this.styles = css `
24
- :host,
25
- .wardley-button {
26
- display: block;
27
- width: 100%;
28
- height: 100%;
29
- }
30
- /* Make this 96px button the containing block of the popup's clip wrapper
31
- (it is appended to our shadow root) so the sub-menu anchors to THIS
32
- button — not the whole toolbar — and can be centered over it. */
33
- :host {
34
- position: relative;
35
- }
36
- .wardley-root {
37
- width: 100%;
38
- height: 64px;
39
- position: relative;
40
- overflow: hidden;
41
- cursor: pointer;
42
- display: flex;
43
- align-items: flex-end;
44
- justify-content: center;
45
- }
46
- .wardley-card {
47
- --y: -4px;
48
- --s: 1;
49
- position: absolute;
50
- bottom: 0;
51
- width: 54px;
52
- height: 54px;
53
- transform: translateY(var(--y)) scale(var(--s)); /* base */
54
- translate: var(--active-x, 0) var(--active-y, 0); /* actif */
55
- rotate: var(--active-r, -2deg);
56
- scale: var(--active-s, 1);
57
- transition: transform 0.3s ease, translate 0.3s ease,
58
- rotate 0.3s ease, scale 0.3s ease;
59
- }
60
- .wardley-card svg {
61
- display: block;
62
- width: 100%;
63
- height: 100%;
64
- }
65
- .wardley-root:hover .wardley-card {
66
- --y: -10px;
67
- --s: 1.07;
68
- }
23
+ static { this.styles = css `
24
+ :host,
25
+ .wardley-button {
26
+ display: block;
27
+ width: 100%;
28
+ height: 100%;
29
+ }
30
+ /* Make this 96px button the containing block of the popup's clip wrapper
31
+ (it is appended to our shadow root) so the sub-menu anchors to THIS
32
+ button — not the whole toolbar — and can be centered over it. */
33
+ :host {
34
+ position: relative;
35
+ }
36
+ .wardley-root {
37
+ width: 100%;
38
+ height: 64px;
39
+ position: relative;
40
+ overflow: hidden;
41
+ cursor: pointer;
42
+ display: flex;
43
+ align-items: flex-end;
44
+ justify-content: center;
45
+ }
46
+ .wardley-card {
47
+ --y: -4px;
48
+ --s: 1;
49
+ position: absolute;
50
+ bottom: 0;
51
+ width: 54px;
52
+ height: 54px;
53
+ transform: translateY(var(--y)) scale(var(--s)); /* base */
54
+ translate: var(--active-x, 0) var(--active-y, 0); /* actif */
55
+ rotate: var(--active-r, -2deg);
56
+ scale: var(--active-s, 1);
57
+ transition: transform 0.3s ease, translate 0.3s ease,
58
+ rotate 0.3s ease, scale 0.3s ease;
59
+ }
60
+ .wardley-card svg {
61
+ display: block;
62
+ width: 100%;
63
+ height: 100%;
64
+ }
65
+ .wardley-root:hover .wardley-card {
66
+ --y: -10px;
67
+ --s: 1.07;
68
+ }
69
69
  `; }
70
70
  _toggleMenu() {
71
71
  // Toggle on popper presence (not tool-active state): the menu stays open on
@@ -130,17 +130,16 @@ export class EdgelessWardleySeniorButton extends EdgelessToolbarToolMixin(Signal
130
130
  });
131
131
  }
132
132
  render() {
133
- return html `<edgeless-toolbar-button
134
- class="wardley-button"
135
- .tooltip=${this.popper ? '' : 'Wardley map'}
136
- .tooltipOffset=${4}
137
- .active=${!!this.popper}
138
- @click=${this._toggleMenu}
139
- >
140
- <div class="wardley-root">
141
- <div class="wardley-card">${wardleyToolbarIcon}</div>
142
- </div>
133
+ return html `<edgeless-toolbar-button
134
+ class="wardley-button"
135
+ .tooltip=${this.popper ? '' : 'Wardley map'}
136
+ .tooltipOffset=${4}
137
+ .active=${!!this.popper}
138
+ @click=${this._toggleMenu}
139
+ >
140
+ <div class="wardley-root">
141
+ <div class="wardley-card">${wardleyToolbarIcon}</div>
142
+ </div>
143
143
  </edgeless-toolbar-button>`;
144
144
  }
145
145
  }
146
- //# sourceMappingURL=wardley-senior-button.js.map
package/dist/view.d.ts CHANGED
@@ -4,4 +4,3 @@ export declare class WardleyViewExtension extends ViewExtensionProvider {
4
4
  effect(): void;
5
5
  setup(context: ViewExtensionContext): void;
6
6
  }
7
- //# sourceMappingURL=view.d.ts.map
package/dist/view.js CHANGED
@@ -33,4 +33,3 @@ export class WardleyViewExtension extends ViewExtensionProvider {
33
33
  }
34
34
  }
35
35
  }
36
- //# sourceMappingURL=view.js.map
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@formicoidea/labre-framework-wardley",
3
3
  "description": "Labre wardley framework for @formicoidea/labre-core.",
4
- "version": "0.23.1",
4
+ "version": "0.23.3",
5
5
  "type": "module",
6
6
  "sideEffects": false,
7
7
  "author": "lajola",
@@ -27,7 +27,7 @@
27
27
  "dist"
28
28
  ],
29
29
  "dependencies": {
30
- "@formicoidea/labre-core": "0.23.1",
30
+ "@formicoidea/labre-core": "0.23.3",
31
31
  "lit": "^3.2.0"
32
32
  }
33
33
  }
@@ -1,28 +0,0 @@
1
- import { WardleyNodeElementModel } from '@blocksuite/affine-model';
2
- import type { RichText } from '@blocksuite/affine-rich-text';
3
- import { type BlockComponent, type BlockStdScope, ShadowlessElement } from '@blocksuite/std';
4
- import { nothing } from 'lit';
5
- /**
6
- * Mount an inline editor over a Wardley node's label. A trimmed clone of
7
- * `EdgelessShapeTextEditor`, bound to {@link WardleyNodeElementModel.text} and
8
- * positioned at the label spot (right of the circle + `labelOffset`).
9
- */
10
- export declare function mountWardleyNodeLabelEditor(node: WardleyNodeElementModel, edgeless: BlockComponent): void;
11
- declare const EdgelessWardleyNodeLabelEditor_base: typeof ShadowlessElement & import("@blocksuite/global/utils").Constructor<import("@blocksuite/global/lit").DisposableClass>;
12
- export declare class EdgelessWardleyNodeLabelEditor extends EdgelessWardleyNodeLabelEditor_base {
13
- get inlineEditor(): import("@blocksuite/affine-shared/types").AffineInlineEditor | null;
14
- get crud(): import("@blocksuite/affine-block-surface").EdgelessCRUDExtension;
15
- get gfx(): import("@blocksuite/std/gfx").GfxController;
16
- get selection(): import("@blocksuite/std/gfx").GfxSelectionManager;
17
- get inlineEditorContainer(): import("@blocksuite/std/inline").InlineRootElement<import("@blocksuite/affine-shared/types").AffineTextAttributes> | null | undefined;
18
- private _unmount;
19
- connectedCallback(): void;
20
- firstUpdated(): void;
21
- getUpdateComplete(): Promise<boolean>;
22
- render(): typeof nothing | import("lit-html").TemplateResult<1>;
23
- accessor element: WardleyNodeElementModel;
24
- accessor std: BlockStdScope;
25
- accessor richText: RichText;
26
- }
27
- export {};
28
- //# sourceMappingURL=label-editor.d.ts.map
@@ -1,216 +0,0 @@
1
- var __esDecorate = function(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
2
- function accept(f) {
3
- if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected");
4
- return f;
5
- }
6
- var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
7
- var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
8
- var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
9
- var _, done = false;
10
- for (var i = decorators.length - 1; i >= 0; i--) {
11
- var context = {};
12
- for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
13
- for (var p in contextIn.access) context.access[p] = contextIn.access[p];
14
- context.addInitializer = function(f) {
15
- if (done) throw new TypeError("Cannot add initializers after decoration has completed");
16
- extraInitializers.push(accept(f || null));
17
- };
18
- var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
19
- if (kind === "accessor") {
20
- if (result === void 0) continue;
21
- if (result === null || typeof result !== "object") throw new TypeError("Object expected");
22
- if (_ = accept(result.get)) descriptor.get = _;
23
- if (_ = accept(result.set)) descriptor.set = _;
24
- if (_ = accept(result.init)) initializers.unshift(_);
25
- } else if (_ = accept(result)) {
26
- if (kind === "field") initializers.unshift(_);
27
- else descriptor[key] = _;
28
- }
29
- }
30
- if (target) Object.defineProperty(target, contextIn.name, descriptor);
31
- done = true;
32
- };
33
- var __runInitializers = function(thisArg, initializers, value) {
34
- var useValue = arguments.length > 2;
35
- for (var i = 0; i < initializers.length; i++) {
36
- value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
37
- }
38
- return useValue ? value : void 0;
39
- };
40
- import { DefaultTool, EdgelessCRUDIdentifier, TextUtils } from "@blocksuite/affine-block-surface";
41
- import { WardleyNodeElementModel } from "@blocksuite/affine-model";
42
- import { BlockSuiteError, ErrorCode } from "@blocksuite/global/exceptions";
43
- import { WithDisposable } from "@blocksuite/global/lit";
44
- import { ShadowlessElement, stdContext } from "@blocksuite/std";
45
- import { GfxControllerIdentifier } from "@blocksuite/std/gfx";
46
- import { RANGE_SYNC_EXCLUDE_ATTR } from "@blocksuite/std/inline";
47
- import { consume } from "@lit/context";
48
- import { html, nothing } from "lit";
49
- import { property, query } from "lit/decorators.js";
50
- import { styleMap } from "lit/directives/style-map.js";
51
- import * as Y from "yjs";
52
- import { LABEL } from "./consts";
53
- export function mountWardleyNodeLabelEditor(node, edgeless) {
54
- const mountElm = edgeless.querySelector(".edgeless-mount-point");
55
- if (!mountElm) {
56
- throw new BlockSuiteError(ErrorCode.ValueNotExists, "edgeless block's mount point does not exist");
57
- }
58
- const gfx = edgeless.std.get(GfxControllerIdentifier);
59
- const crud = edgeless.std.get(EdgelessCRUDIdentifier);
60
- const updated = crud.getElementById(node.id);
61
- if (!(updated instanceof WardleyNodeElementModel)) {
62
- console.error("Cannot mount label editor on a non-wardley-node element");
63
- return;
64
- }
65
- gfx.tool.setTool(DefaultTool);
66
- gfx.selection.set({ elements: [node.id], editing: true });
67
- if (!node.text) {
68
- crud.updateElement(node.id, { text: new Y.Text() });
69
- }
70
- const editor = new EdgelessWardleyNodeLabelEditor();
71
- editor.element = crud.getElementById(node.id);
72
- mountElm.append(editor);
73
- }
74
- let EdgelessWardleyNodeLabelEditor = (() => {
75
- let _classSuper = WithDisposable(ShadowlessElement);
76
- let _element_decorators;
77
- let _element_initializers = [];
78
- let _element_extraInitializers = [];
79
- let _std_decorators;
80
- let _std_initializers = [];
81
- let _std_extraInitializers = [];
82
- let _richText_decorators;
83
- let _richText_initializers = [];
84
- let _richText_extraInitializers = [];
85
- return class EdgelessWardleyNodeLabelEditor extends _classSuper {
86
- static {
87
- const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
88
- _element_decorators = [property({ attribute: false })];
89
- _std_decorators = [consume({ context: stdContext })];
90
- _richText_decorators = [query("rich-text")];
91
- __esDecorate(this, null, _element_decorators, { kind: "accessor", name: "element", static: false, private: false, access: { has: (obj) => "element" in obj, get: (obj) => obj.element, set: (obj, value) => {
92
- obj.element = value;
93
- } }, metadata: _metadata }, _element_initializers, _element_extraInitializers);
94
- __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) => {
95
- obj.std = value;
96
- } }, metadata: _metadata }, _std_initializers, _std_extraInitializers);
97
- __esDecorate(this, null, _richText_decorators, { kind: "accessor", name: "richText", static: false, private: false, access: { has: (obj) => "richText" in obj, get: (obj) => obj.richText, set: (obj, value) => {
98
- obj.richText = value;
99
- } }, metadata: _metadata }, _richText_initializers, _richText_extraInitializers);
100
- if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
101
- }
102
- get inlineEditor() {
103
- return this.richText.inlineEditor;
104
- }
105
- get crud() {
106
- return this.std.get(EdgelessCRUDIdentifier);
107
- }
108
- get gfx() {
109
- return this.std.get(GfxControllerIdentifier);
110
- }
111
- get selection() {
112
- return this.gfx.selection;
113
- }
114
- get inlineEditorContainer() {
115
- return this.inlineEditor?.rootElement;
116
- }
117
- _unmount() {
118
- if (this.element.text) {
119
- const text = this.element.text.toString();
120
- const trimmed = text.trim();
121
- if (trimmed.length === 0) {
122
- this.crud.updateElement(this.element.id, { text: void 0 });
123
- } else if (trimmed.length < text.length) {
124
- this.crud.updateElement(this.element.id, {
125
- text: new Y.Text(trimmed)
126
- });
127
- }
128
- }
129
- this.remove();
130
- this.selection.set({ elements: [], editing: false });
131
- }
132
- connectedCallback() {
133
- super.connectedCallback();
134
- this.setAttribute(RANGE_SYNC_EXCLUDE_ATTR, "true");
135
- }
136
- firstUpdated() {
137
- this.disposables.add(this.gfx.viewport.viewportUpdated.subscribe(() => this.requestUpdate()));
138
- this.updateComplete.then(() => {
139
- if (!this.inlineEditor)
140
- return;
141
- this.inlineEditor.focusEnd();
142
- if (!this.inlineEditorContainer)
143
- return;
144
- this.disposables.addFromEvent(this.inlineEditorContainer, "blur", () => this._unmount());
145
- }).catch(console.error);
146
- this.disposables.addFromEvent(this, "keydown", (evt) => {
147
- if (evt.key === "Escape") {
148
- this.ownerDocument.activeElement?.blur();
149
- }
150
- });
151
- }
152
- async getUpdateComplete() {
153
- const result = await super.getUpdateComplete();
154
- await this.richText?.updateComplete;
155
- return result;
156
- }
157
- render() {
158
- if (!this.element.text)
159
- return nothing;
160
- const [, , w, h] = this.element.deserializedXYWH;
161
- const R = Math.min(w, h) / 2;
162
- const [ox, oy] = this.element.labelOffset ?? [0, 0];
163
- const modelX = this.element.x + w / 2 + R + LABEL.gap + ox;
164
- const modelY = this.element.y + h / 2 + oy - LABEL.font / 2;
165
- const [x, y] = this.gfx.viewport.toViewCoord(modelX, modelY);
166
- const zoom = this.gfx.viewport.zoom;
167
- const style = styleMap({
168
- position: "absolute",
169
- left: `${x}px`,
170
- top: `${y}px`,
171
- minWidth: "8px",
172
- fontSize: `${LABEL.font}px`,
173
- fontFamily: TextUtils.wrapFontFamily(LABEL.family),
174
- lineHeight: "normal",
175
- color: LABEL.color,
176
- outline: "none",
177
- whiteSpace: "nowrap",
178
- transform: `scale(${zoom}, ${zoom})`,
179
- transformOrigin: "top left",
180
- zIndex: "1"
181
- });
182
- return html`<rich-text
183
- .yText=${this.element.text}
184
- .enableFormat=${false}
185
- .enableAutoScrollHorizontally=${false}
186
- style=${style}
187
- ></rich-text>`;
188
- }
189
- #element = __runInitializers(this, _element_initializers, void 0);
190
- get element() {
191
- return this.#element;
192
- }
193
- set element(_) {
194
- this.#element = _;
195
- }
196
- #std = (__runInitializers(this, _element_extraInitializers), __runInitializers(this, _std_initializers, void 0));
197
- get std() {
198
- return this.#std;
199
- }
200
- set std(_) {
201
- this.#std = _;
202
- }
203
- #richText = (__runInitializers(this, _std_extraInitializers), __runInitializers(this, _richText_initializers, void 0));
204
- get richText() {
205
- return this.#richText;
206
- }
207
- set richText(_) {
208
- this.#richText = _;
209
- }
210
- constructor() {
211
- super(...arguments);
212
- __runInitializers(this, _richText_extraInitializers);
213
- }
214
- };
215
- })();
216
- export { EdgelessWardleyNodeLabelEditor };
@@ -1,10 +0,0 @@
1
- import type { GfxController } from '@blocksuite/std/gfx';
2
- import { LitElement } from 'lit';
3
- /** Toolbar button that drops a Wardley map background at the viewport center. */
4
- export declare class EdgelessWardleyToolButton extends LitElement {
5
- static styles: import("lit").CSSResult;
6
- private _addWardley;
7
- render(): import("lit-html").TemplateResult<1>;
8
- accessor gfx: GfxController;
9
- }
10
- //# sourceMappingURL=wardley-tool-button.d.ts.map