@lit-pigeon/editor 0.1.3 → 0.3.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/index.d.ts +86 -9
- package/dist/index.js +2072 -1548
- package/dist/pigeon-brand-tab.js +195 -0
- package/dist/pigeon-saved-tab.js +93 -0
- package/dist/pigeon-stock-tab.js +258 -0
- package/dist/rich-text.js +2265 -2198
- package/dist/templates.js +319 -50
- package/package.json +2 -2
package/dist/index.d.ts
CHANGED
|
@@ -1,18 +1,24 @@
|
|
|
1
1
|
import { AssetManagerConfig } from '@lit-pigeon/core';
|
|
2
2
|
import { AssetStorage } from '@lit-pigeon/core';
|
|
3
|
+
import { BrandColor } from '@lit-pigeon/core';
|
|
4
|
+
import { BrandKit } from '@lit-pigeon/core';
|
|
3
5
|
import { ButtonBlock } from '@lit-pigeon/core';
|
|
4
6
|
import { ColumnNode } from '@lit-pigeon/core';
|
|
5
7
|
import { CSSResult } from 'lit';
|
|
6
8
|
import { DividerBlock } from '@lit-pigeon/core';
|
|
7
9
|
import { EditorConfig } from '@lit-pigeon/core';
|
|
10
|
+
import { FontDefinition } from '@lit-pigeon/core';
|
|
8
11
|
import { HeroBlock } from '@lit-pigeon/core';
|
|
9
12
|
import { HtmlBlock } from '@lit-pigeon/core';
|
|
10
13
|
import { ImageBlock } from '@lit-pigeon/core';
|
|
14
|
+
import { LinkType } from '@lit-pigeon/core';
|
|
11
15
|
import { LitElement } from 'lit';
|
|
12
16
|
import { MergeTag } from '@lit-pigeon/core';
|
|
13
17
|
import { NavBarBlock } from '@lit-pigeon/core';
|
|
14
18
|
import { PigeonDocument } from '@lit-pigeon/core';
|
|
19
|
+
import { PropertyValues } from 'lit';
|
|
15
20
|
import { Renderer } from '@lit-pigeon/core';
|
|
21
|
+
import { RowLibraryStorage } from '@lit-pigeon/core';
|
|
16
22
|
import { RowNode } from '@lit-pigeon/core';
|
|
17
23
|
import { Selection as Selection_2 } from '@lit-pigeon/core';
|
|
18
24
|
import { SocialBlock } from '@lit-pigeon/core';
|
|
@@ -46,13 +52,11 @@ export declare interface DragData {
|
|
|
46
52
|
blockId?: string;
|
|
47
53
|
rowId?: string;
|
|
48
54
|
columnId?: string;
|
|
55
|
+
/** Saved row node for library-row drags. */
|
|
56
|
+
node?: RowNode;
|
|
49
57
|
}
|
|
50
58
|
|
|
51
|
-
|
|
52
|
-
* Drag-and-drop manager using native HTML5 drag/drop API.
|
|
53
|
-
* Stores drag state globally so any component can query it.
|
|
54
|
-
*/
|
|
55
|
-
export declare type DragItemType = 'palette-block' | 'palette-row' | 'existing-block' | 'existing-row';
|
|
59
|
+
export declare type DragItemType = 'palette-block' | 'palette-row' | 'existing-block' | 'existing-row' | 'library-row';
|
|
56
60
|
|
|
57
61
|
/**
|
|
58
62
|
* Drop-zone calculation utilities.
|
|
@@ -97,6 +101,7 @@ export declare class PigeonAssetManager extends LitElement {
|
|
|
97
101
|
* cycle out of an update→state→update loop on initial property arrival.
|
|
98
102
|
*/
|
|
99
103
|
private _tab;
|
|
104
|
+
private _stockTabLoaded;
|
|
100
105
|
private _dragOver;
|
|
101
106
|
private _uploading;
|
|
102
107
|
private _progress;
|
|
@@ -119,8 +124,11 @@ export declare class PigeonAssetManager extends LitElement {
|
|
|
119
124
|
static styles: CSSResult;
|
|
120
125
|
updated(changed: Map<string, unknown>): void;
|
|
121
126
|
private get _activeTab();
|
|
127
|
+
private get _hasStock();
|
|
122
128
|
render(): TemplateResult<1>;
|
|
123
129
|
private _renderTabs;
|
|
130
|
+
private _handleStockTabClick;
|
|
131
|
+
private _renderStock;
|
|
124
132
|
private _renderLibrary;
|
|
125
133
|
private _renderAssetCard;
|
|
126
134
|
private _renderUpload;
|
|
@@ -146,13 +154,14 @@ export declare class PigeonAssetManager extends LitElement {
|
|
|
146
154
|
export declare class PigeonBodyPanel extends LitElement {
|
|
147
155
|
doc: PigeonDocument;
|
|
148
156
|
mergeTags: MergeTag[];
|
|
157
|
+
swatches: BrandColor[];
|
|
158
|
+
brandFonts: FontDefinition[];
|
|
149
159
|
private _pickerOpen;
|
|
150
160
|
private _pickerX;
|
|
151
161
|
private _pickerY;
|
|
152
162
|
private _previewInputRef;
|
|
153
163
|
private _triggerRef;
|
|
154
164
|
static styles: CSSResult[];
|
|
155
|
-
private _fontFamilies;
|
|
156
165
|
render(): TemplateResult<1>;
|
|
157
166
|
private _togglePicker;
|
|
158
167
|
private _onMergeTagInsert;
|
|
@@ -188,12 +197,15 @@ export declare class PigeonButtonPanel extends LitElement {
|
|
|
188
197
|
block: ButtonBlock;
|
|
189
198
|
rowId: string;
|
|
190
199
|
columnId: string;
|
|
200
|
+
swatches: BrandColor[];
|
|
201
|
+
linkTypes: LinkType[];
|
|
191
202
|
static styles: CSSResult;
|
|
192
203
|
render(): TemplateResult<1>;
|
|
193
204
|
private _emit;
|
|
194
205
|
private _onTextChange;
|
|
195
206
|
private _contentToText;
|
|
196
207
|
private _onHrefChange;
|
|
208
|
+
private _onLinkTypeSelect;
|
|
197
209
|
private _onBgColorChange;
|
|
198
210
|
private _onTextColorChange;
|
|
199
211
|
private _onBorderRadiusChange;
|
|
@@ -247,8 +259,11 @@ export declare class PigeonCanvas extends LitElement {
|
|
|
247
259
|
export declare class PigeonColorPicker extends LitElement {
|
|
248
260
|
label: string;
|
|
249
261
|
value: string;
|
|
262
|
+
/** Optional brand-kit swatches rendered as quick-pick buttons. */
|
|
263
|
+
swatches: BrandColor[];
|
|
250
264
|
static styles: CSSResult;
|
|
251
265
|
render(): TemplateResult<1>;
|
|
266
|
+
private _applySwatch;
|
|
252
267
|
private _onColorInput;
|
|
253
268
|
private _onTextChange;
|
|
254
269
|
private _emitChange;
|
|
@@ -261,6 +276,9 @@ export declare class PigeonColumn extends LitElement {
|
|
|
261
276
|
editingBlockId: string | null;
|
|
262
277
|
private _dropIndex;
|
|
263
278
|
private _isDragOver;
|
|
279
|
+
/** Id of the block currently being dragged from this column, or null. Dims
|
|
280
|
+
* the source block while a reorder drag is in flight. */
|
|
281
|
+
private _draggingBlockId;
|
|
264
282
|
static styles: CSSResult;
|
|
265
283
|
render(): TemplateResult<1>;
|
|
266
284
|
private _renderBlock;
|
|
@@ -275,6 +293,9 @@ export declare class PigeonColumn extends LitElement {
|
|
|
275
293
|
private _onDragOver;
|
|
276
294
|
private _onDragLeave;
|
|
277
295
|
private _onDrop;
|
|
296
|
+
private _resetDragState;
|
|
297
|
+
private _onBlockDragStart;
|
|
298
|
+
private _onBlockDragEnd;
|
|
278
299
|
}
|
|
279
300
|
|
|
280
301
|
export declare class PigeonDividerBlock extends LitElement {
|
|
@@ -350,7 +371,9 @@ export declare class PigeonEditor extends LitElement {
|
|
|
350
371
|
/** Optional renderer for preview mode. */
|
|
351
372
|
renderer?: Renderer;
|
|
352
373
|
/** Optional function to convert document to MJML. */
|
|
353
|
-
documentToMjml?: (doc: PigeonDocument
|
|
374
|
+
documentToMjml?: (doc: PigeonDocument, options?: {
|
|
375
|
+
fonts?: FontDefinition[];
|
|
376
|
+
}) => string;
|
|
354
377
|
/**
|
|
355
378
|
* Optional template storage backend. When unset, the editor falls back to
|
|
356
379
|
* an in-memory storage seeded with the starter templates so the picker is
|
|
@@ -377,12 +400,23 @@ export declare class PigeonEditor extends LitElement {
|
|
|
377
400
|
private _editingBlockId;
|
|
378
401
|
/** Lazily-initialised default template storage. */
|
|
379
402
|
private _defaultTemplateStorage?;
|
|
403
|
+
/** Lazily-initialised default row library storage. */
|
|
404
|
+
private _defaultRowLibrary?;
|
|
380
405
|
/** In-memory clipboard for Cmd/Ctrl+C / Cmd/Ctrl+V on blocks. */
|
|
381
406
|
private _clipboard;
|
|
407
|
+
private _activeBrandKit;
|
|
408
|
+
private _brandKitStorage;
|
|
382
409
|
static styles: CSSResult[];
|
|
383
410
|
connectedCallback(): void;
|
|
384
411
|
disconnectedCallback(): void;
|
|
385
412
|
updated(changed: Map<string, unknown>): void;
|
|
413
|
+
/**
|
|
414
|
+
* Set the host `dir` attribute based on `config.locale` and `config.dir`.
|
|
415
|
+
* The host `dir` attribute drives the layout direction automatically for RTL locales.
|
|
416
|
+
* The `.editor-body` flex layout will flip under `dir="rtl"` via the browser's built-in
|
|
417
|
+
* bidirectional layout support.
|
|
418
|
+
*/
|
|
419
|
+
private _applyDir;
|
|
386
420
|
/**
|
|
387
421
|
* Sync the active `theme` to the host classes the token sheet keys off, and
|
|
388
422
|
* apply any `themeOverrides` as inline custom properties.
|
|
@@ -407,6 +441,23 @@ export declare class PigeonEditor extends LitElement {
|
|
|
407
441
|
setMergeTags(tags: MergeTag[]): void;
|
|
408
442
|
render(): TemplateResult<1>;
|
|
409
443
|
private _resolveTemplateStorage;
|
|
444
|
+
private _resolveRowLibrary;
|
|
445
|
+
private _linkTypes;
|
|
446
|
+
/**
|
|
447
|
+
* Resolve `config.brandKit` into a single active kit. A plain `BrandKit` is
|
|
448
|
+
* used directly; a `BrandKitStorage` (duck-typed by a `list` method) is
|
|
449
|
+
* async-loaded and the first kit becomes active.
|
|
450
|
+
*/
|
|
451
|
+
private _resolveBrandKit;
|
|
452
|
+
/** Fonts to load in preview/export: host fontConfig + brand fonts that carry a URL, deduped by family. */
|
|
453
|
+
private _renderFonts;
|
|
454
|
+
private _emitBrandKitError;
|
|
455
|
+
private _handleBrandKitEdit;
|
|
456
|
+
/** Apply a single body attribute through an undoable transaction. */
|
|
457
|
+
private _applyBodyAttribute;
|
|
458
|
+
private _handleBrandColorApply;
|
|
459
|
+
private _handleBrandFontApply;
|
|
460
|
+
private _handleBrandLogoInsert;
|
|
410
461
|
private _handleTemplatesOpen;
|
|
411
462
|
private _handleTemplateLoad;
|
|
412
463
|
private _handleTemplateSave;
|
|
@@ -433,6 +484,12 @@ export declare class PigeonEditor extends LitElement {
|
|
|
433
484
|
private _handleRowMove;
|
|
434
485
|
private _handleRowDuplicate;
|
|
435
486
|
private _handleRowDelete;
|
|
487
|
+
private _handleRowSave;
|
|
488
|
+
private _handleRowInsertSaved;
|
|
489
|
+
private _handleLibraryInsert;
|
|
490
|
+
private _handleLibraryDelete;
|
|
491
|
+
private _refreshSavedTab;
|
|
492
|
+
private _emitRowLibraryError;
|
|
436
493
|
/**
|
|
437
494
|
* Returns true if the event originates from a text-editing context
|
|
438
495
|
* (input, textarea, select, or contentEditable element), in which
|
|
@@ -485,6 +542,7 @@ export declare class PigeonHeroPanel extends LitElement {
|
|
|
485
542
|
columnId: string;
|
|
486
543
|
assetManagerConfig?: AssetManagerConfig;
|
|
487
544
|
assetStorage?: AssetStorage;
|
|
545
|
+
swatches: BrandColor[];
|
|
488
546
|
private _assetManagerOpen;
|
|
489
547
|
static styles: CSSResult[];
|
|
490
548
|
render(): TemplateResult<1>;
|
|
@@ -577,6 +635,7 @@ export declare class PigeonNavBarPanel extends LitElement {
|
|
|
577
635
|
block: NavBarBlock;
|
|
578
636
|
rowId: string;
|
|
579
637
|
columnId: string;
|
|
638
|
+
swatches: BrandColor[];
|
|
580
639
|
static styles: CSSResult[];
|
|
581
640
|
render(): TemplateResult<1>;
|
|
582
641
|
private _emit;
|
|
@@ -595,13 +654,22 @@ export declare class PigeonNavBarPanel extends LitElement {
|
|
|
595
654
|
export declare class PigeonPalette extends LitElement {
|
|
596
655
|
doc?: PigeonDocument;
|
|
597
656
|
selection: Selection_2 | null;
|
|
657
|
+
brandKit: BrandKit | null;
|
|
658
|
+
rowLibrary: RowLibraryStorage | null;
|
|
598
659
|
private _blockDefs;
|
|
599
660
|
private _activeTab;
|
|
661
|
+
private _brandTabLoaded;
|
|
662
|
+
private _savedTabLoaded;
|
|
600
663
|
static styles: CSSResult;
|
|
601
664
|
connectedCallback(): void;
|
|
665
|
+
updated(changed: PropertyValues): void;
|
|
602
666
|
render(): TemplateResult<1>;
|
|
603
667
|
private _renderContentTab;
|
|
604
668
|
private _renderLayersTab;
|
|
669
|
+
private _handleBrandTabClick;
|
|
670
|
+
private _renderBrandTab;
|
|
671
|
+
private _handleSavedTabClick;
|
|
672
|
+
private _renderSavedTab;
|
|
605
673
|
}
|
|
606
674
|
|
|
607
675
|
export declare class PigeonPaletteItem extends LitElement {
|
|
@@ -623,7 +691,10 @@ export declare class PigeonPaletteItem extends LitElement {
|
|
|
623
691
|
export declare class PigeonPreview extends LitElement {
|
|
624
692
|
renderer?: Renderer;
|
|
625
693
|
doc?: PigeonDocument;
|
|
626
|
-
documentToMjml?: (doc: PigeonDocument
|
|
694
|
+
documentToMjml?: (doc: PigeonDocument, options?: {
|
|
695
|
+
fonts?: FontDefinition[];
|
|
696
|
+
}) => string;
|
|
697
|
+
fonts: FontDefinition[];
|
|
627
698
|
open: boolean;
|
|
628
699
|
private _viewMode;
|
|
629
700
|
private _device;
|
|
@@ -656,6 +727,11 @@ export declare class PigeonProperties extends LitElement {
|
|
|
656
727
|
mergeTags: MergeTag[];
|
|
657
728
|
assetManagerConfig?: AssetManagerConfig;
|
|
658
729
|
assetStorage?: AssetStorage;
|
|
730
|
+
brandKit: BrandKit | null;
|
|
731
|
+
fontConfig: FontDefinition[];
|
|
732
|
+
linkTypes: LinkType[];
|
|
733
|
+
private get _swatches();
|
|
734
|
+
private get _brandFonts();
|
|
659
735
|
static styles: CSSResult;
|
|
660
736
|
render(): TemplateResult<1>;
|
|
661
737
|
/**
|
|
@@ -688,6 +764,7 @@ export declare class PigeonRow extends LitElement {
|
|
|
688
764
|
private _onMoveUp;
|
|
689
765
|
private _onMoveDown;
|
|
690
766
|
private _onDuplicate;
|
|
767
|
+
private _onSave;
|
|
691
768
|
private _onDelete;
|
|
692
769
|
private _onDragStart;
|
|
693
770
|
private _onDragEnd;
|
|
@@ -696,7 +773,7 @@ export declare class PigeonRow extends LitElement {
|
|
|
696
773
|
export declare class PigeonRowPanel extends LitElement {
|
|
697
774
|
row: RowNode;
|
|
698
775
|
static styles: CSSResult[];
|
|
699
|
-
private _layouts;
|
|
776
|
+
private get _layouts();
|
|
700
777
|
render(): TemplateResult<1>;
|
|
701
778
|
private _emitRowUpdate;
|
|
702
779
|
private _onLayoutSelect;
|