@blokkli/editor 1.0.4 → 1.1.1
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/module.json +1 -1
- package/dist/module.mjs +345 -16
- package/dist/runtime/adapter/drupal/graphql/base.graphql +2 -1
- package/dist/runtime/adapter/drupal/graphqlMiddleware.js +4 -1
- package/dist/runtime/adapter/index.d.ts +12 -1
- package/dist/runtime/blokkliPlugins/Sidebar/Detached/index.vue +41 -39
- package/dist/runtime/blokkliPlugins/Sidebar/index.vue +10 -16
- package/dist/runtime/blokkliPlugins/ViewOption/index.vue +2 -0
- package/dist/runtime/components/BlokkliField.vue +75 -17
- package/dist/runtime/components/BlokkliItem.vue +34 -6
- package/dist/runtime/components/BlokkliProvider.vue +18 -1
- package/dist/runtime/components/Edit/BlockProxy/index.vue +102 -0
- package/dist/runtime/components/Edit/DragInteractions/index.vue +49 -25
- package/dist/runtime/components/Edit/DraggableList.vue +140 -30
- package/dist/runtime/components/Edit/EditProvider.vue +4 -0
- package/dist/runtime/components/Edit/Features/AddList/index.vue +3 -0
- package/dist/runtime/components/Edit/Features/Artboard/Overview/index.vue +111 -0
- package/dist/runtime/components/Edit/Features/Artboard/Scrollbar/index.vue +47 -0
- package/dist/runtime/components/Edit/Features/Artboard/index.vue +301 -9
- package/dist/runtime/components/Edit/Features/BlockAddList/index.vue +29 -4
- package/dist/runtime/components/Edit/Features/CommandPalette/Palette/index.vue +3 -4
- package/dist/runtime/components/Edit/Features/Debug/Rects/index.vue +27 -0
- package/dist/runtime/components/Edit/Features/DraggingOverlay/DragItems/index.vue +24 -3
- package/dist/runtime/components/Edit/Features/DraggingOverlay/DropTargets/fragment.glsl +56 -24
- package/dist/runtime/components/Edit/Features/DraggingOverlay/DropTargets/index.vue +184 -29
- package/dist/runtime/components/Edit/Features/DraggingOverlay/DropTargets/vertex.glsl +36 -16
- package/dist/runtime/components/Edit/Features/DraggingOverlay/index.vue +4 -0
- package/dist/runtime/components/Edit/Features/Duplicate/index.vue +1 -13
- package/dist/runtime/components/Edit/Features/EditableMask/index.vue +2 -2
- package/dist/runtime/components/Edit/Features/History/index.vue +1 -1
- package/dist/runtime/components/Edit/Features/Options/Form/Checkbox/index.vue +2 -2
- package/dist/runtime/components/Edit/Features/Options/Form/Checkboxes/index.vue +28 -25
- package/dist/runtime/components/Edit/Features/Options/Form/Color/index.vue +1 -1
- package/dist/runtime/components/Edit/Features/Options/Form/Item.vue +67 -39
- package/dist/runtime/components/Edit/Features/Options/Form/Number/index.vue +6 -2
- package/dist/runtime/components/Edit/Features/Options/Form/Radios/index.vue +1 -1
- package/dist/runtime/components/Edit/Features/Options/Form/Range/index.vue +2 -2
- package/dist/runtime/components/Edit/Features/Options/Form/Text/index.vue +2 -1
- package/dist/runtime/components/Edit/Features/Options/Form/index.vue +83 -33
- package/dist/runtime/components/Edit/Features/ProxyView/index.vue +38 -0
- package/dist/runtime/components/Edit/Features/Publish/index.vue +53 -6
- package/dist/runtime/components/Edit/Features/Search/Overlay/index.vue +3 -13
- package/dist/runtime/components/Edit/Features/Selection/Overlay/index.vue +1 -1
- package/dist/runtime/components/Edit/Features/Settings/Dialog/index.vue +2 -0
- package/dist/runtime/components/Edit/Features/Structure/List/Field/index.vue +3 -3
- package/dist/runtime/components/Edit/Features/Structure/index.vue +3 -3
- package/dist/runtime/components/Edit/ScrollBoundary/index.vue +24 -0
- package/dist/runtime/components/Edit/index.d.ts +2 -1
- package/dist/runtime/components/Edit/index.js +3 -1
- package/dist/runtime/composables/defineBlokkli.js +10 -5
- package/dist/runtime/constants/index.d.ts +1 -1
- package/dist/runtime/constants/index.js +6 -1
- package/dist/runtime/css/output.css +1 -1
- package/dist/runtime/helpers/animationProvider.js +10 -4
- package/dist/runtime/helpers/domProvider.d.ts +12 -4
- package/dist/runtime/helpers/domProvider.js +70 -26
- package/dist/runtime/helpers/featuresProvider.d.ts +1 -1
- package/dist/runtime/helpers/runtimeHelpers/index.d.ts +6 -0
- package/dist/runtime/helpers/runtimeHelpers/index.js +25 -0
- package/dist/runtime/helpers/selectionProvider.d.ts +2 -1
- package/dist/runtime/helpers/selectionProvider.js +7 -8
- package/dist/runtime/helpers/symbols.d.ts +7 -0
- package/dist/runtime/helpers/symbols.js +7 -0
- package/dist/runtime/helpers/typesProvider.d.ts +1 -1
- package/dist/runtime/helpers/uiProvider.d.ts +1 -0
- package/dist/runtime/helpers/uiProvider.js +16 -3
- package/dist/runtime/helpers/webgl/index.d.ts +6 -1
- package/dist/runtime/helpers/webgl/index.js +38 -5
- package/dist/runtime/icons/eye.svg +1 -0
- package/dist/runtime/types/generatedModuleTypes.d.ts +12 -4
- package/dist/runtime/types/index.d.ts +30 -1
- package/package.json +7 -5
- package/dist/runtime/components/Edit/Features/Artboard/Manager/Artboard.d.ts +0 -204
- package/dist/runtime/components/Edit/Features/Artboard/Manager/Artboard.js +0 -748
- package/dist/runtime/components/Edit/Features/Artboard/Manager/Scrollbar/index.vue +0 -176
- package/dist/runtime/components/Edit/Features/Artboard/Manager/index.vue +0 -317
- package/dist/runtime/helpers/Artboard/index.d.ts +0 -16
- package/dist/runtime/helpers/Artboard/index.js +0 -20
|
@@ -192,6 +192,27 @@ export type BlokkliDefinitionInputEditor<Options extends BlockDefinitionOptionsI
|
|
|
192
192
|
* appears to be selectable/draggable.
|
|
193
193
|
*/
|
|
194
194
|
getDraggableElement?: (el: HTMLElement) => Element | undefined | null;
|
|
195
|
+
/**
|
|
196
|
+
* Define how the nested fields should be structured when the block is
|
|
197
|
+
* rendered without its component, for example when using
|
|
198
|
+
* `:proxy-mode="true"` on <BlokkliField>.
|
|
199
|
+
*
|
|
200
|
+
* Each array should define an array of field names.
|
|
201
|
+
*
|
|
202
|
+
* @example
|
|
203
|
+
* ```typescript
|
|
204
|
+
* defineBlokkli({
|
|
205
|
+
* bundle: 'three_columns',
|
|
206
|
+
* editor: {
|
|
207
|
+
* fieldLayout: [
|
|
208
|
+
* ['header'],
|
|
209
|
+
* ['left', 'center', 'right'],
|
|
210
|
+
* ]
|
|
211
|
+
* }
|
|
212
|
+
* })
|
|
213
|
+
* ```
|
|
214
|
+
*/
|
|
215
|
+
fieldLayout?: string[][];
|
|
195
216
|
};
|
|
196
217
|
export type BlockDefinitionRenderForParent = {
|
|
197
218
|
parentBundle: BlockBundleWithNested;
|
|
@@ -286,6 +307,12 @@ export type EntityContext = {
|
|
|
286
307
|
type: string;
|
|
287
308
|
bundle: string;
|
|
288
309
|
};
|
|
310
|
+
export type BlokkliProviderEntityContext = {
|
|
311
|
+
uuid: string;
|
|
312
|
+
type: string;
|
|
313
|
+
bundle: string;
|
|
314
|
+
language?: string;
|
|
315
|
+
};
|
|
289
316
|
export type EditEntity = {
|
|
290
317
|
label?: string;
|
|
291
318
|
status?: boolean;
|
|
@@ -742,6 +769,7 @@ export type BlokkliFieldElement = {
|
|
|
742
769
|
name: string;
|
|
743
770
|
label: string;
|
|
744
771
|
isNested: boolean;
|
|
772
|
+
nestingLevel: number;
|
|
745
773
|
fieldListType: ValidFieldListTypes;
|
|
746
774
|
hostEntityType: string;
|
|
747
775
|
hostEntityBundle: string;
|
|
@@ -841,7 +869,7 @@ export type EventbusEvents = {
|
|
|
841
869
|
'block:append': BlockAppendEvent;
|
|
842
870
|
'item:doubleClick': DraggableExistingBlock;
|
|
843
871
|
scrollIntoView: ScrollIntoViewEvent;
|
|
844
|
-
'animationFrame:before':
|
|
872
|
+
'animationFrame:before': number;
|
|
845
873
|
'canvas:draw': CanvasDrawEvent;
|
|
846
874
|
'state:reloaded': undefined;
|
|
847
875
|
addContentSearchItem: AddContentSearchItemEvent;
|
|
@@ -854,6 +882,7 @@ export type EventbusEvents = {
|
|
|
854
882
|
'droppable:focus': DroppableEntityField;
|
|
855
883
|
'drop:clipboardItem': DropClipboardItemEvent;
|
|
856
884
|
'sidebar:close': undefined;
|
|
885
|
+
'sidebar:open': string;
|
|
857
886
|
'action:placed': ActionPlacedEvent;
|
|
858
887
|
'animator:add': AnimatorAddEvent;
|
|
859
888
|
'ui:resized': undefined;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blokkli/editor",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"description": "Interactive page building experience for Nuxt",
|
|
5
5
|
"repository": "blokkli/editor",
|
|
6
6
|
"type": "module",
|
|
@@ -19,15 +19,15 @@
|
|
|
19
19
|
"scripts": {
|
|
20
20
|
"prepack": "nuxt-module-build build && find dist/ -type f -name '*.*' | grep '.spec.' | xargs rm -f",
|
|
21
21
|
"dev": "nuxi dev playground --host",
|
|
22
|
-
"typecheck": "
|
|
22
|
+
"typecheck": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit",
|
|
23
23
|
"dev:minimal": "nuxi dev playground-minimal --host",
|
|
24
24
|
"dev:content": "nuxi dev playground-content --host",
|
|
25
25
|
"styles:build": "postcss ./css/index.css -o ./src/runtime/css/output.css",
|
|
26
26
|
"styles:watch": "postcss ./css/index.css -o ./src/runtime/css/output.css --watch",
|
|
27
|
-
"dev:build": "nuxi generate playground",
|
|
27
|
+
"dev:build": "npm run dev:prepare && nuxi generate playground",
|
|
28
28
|
"dev:start": "npx serve playground/.output/public",
|
|
29
29
|
"dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
|
|
30
|
-
"release": "npm run lint && npm run
|
|
30
|
+
"release": "npm run lint && npm run prepack && changelogen --release",
|
|
31
31
|
"texts": "node ./scripts/texts/index.cjs",
|
|
32
32
|
"generate-types": "node ./scripts/generateTypes/index.cjs",
|
|
33
33
|
"lint": "eslint ./src",
|
|
@@ -49,6 +49,7 @@
|
|
|
49
49
|
"license": "MIT",
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@nuxt/kit": "^3.13.1",
|
|
52
|
+
"artboard-deluxe": "^0.0.1",
|
|
52
53
|
"estree-walker-ts": "^1.0.1",
|
|
53
54
|
"fzf": "^0.5.2",
|
|
54
55
|
"get-video-id": "^4.1.7",
|
|
@@ -95,7 +96,8 @@
|
|
|
95
96
|
"tailwindcss": "^3.4.11",
|
|
96
97
|
"vite-plugin-glsl": "^1.3.0",
|
|
97
98
|
"vitepress": "^1.3.4",
|
|
98
|
-
"vitest": "^2.0.5"
|
|
99
|
+
"vitest": "^2.0.5",
|
|
100
|
+
"vue-tsc": "^2.1.6"
|
|
99
101
|
},
|
|
100
102
|
"overrides": {
|
|
101
103
|
"@parcel/watcher": "~2.1.0"
|
|
@@ -1,204 +0,0 @@
|
|
|
1
|
-
import type { Coord, Size, Rectangle } from '#blokkli/types';
|
|
2
|
-
type TouchDirection = 'horizontal' | 'vertical' | 'both' | 'none';
|
|
3
|
-
/**
|
|
4
|
-
* Implements a time-based queue.
|
|
5
|
-
*/
|
|
6
|
-
declare class Queue<T> {
|
|
7
|
-
queue: T[];
|
|
8
|
-
timeQueue: number[];
|
|
9
|
-
reset(): void;
|
|
10
|
-
pruneQueue(ms: number): void;
|
|
11
|
-
add(position: T): void;
|
|
12
|
-
}
|
|
13
|
-
/**
|
|
14
|
-
* Implements a queue to calculate the velocity of 2D coordinates.
|
|
15
|
-
*/
|
|
16
|
-
declare class VelocityQueue extends Queue<Coord> {
|
|
17
|
-
max: number;
|
|
18
|
-
constructor(max: number);
|
|
19
|
-
getVelocity(): Coord;
|
|
20
|
-
private limit;
|
|
21
|
-
}
|
|
22
|
-
declare class ScaleVelocityQueue extends Queue<number> {
|
|
23
|
-
getVelocity(): number;
|
|
24
|
-
}
|
|
25
|
-
type PossibleDragEventPosition = Array<Touch | MouseEvent> | TouchList;
|
|
26
|
-
export type ArtboardOptions = {
|
|
27
|
-
x?: number;
|
|
28
|
-
y?: number;
|
|
29
|
-
scale?: number;
|
|
30
|
-
padding?: number;
|
|
31
|
-
scrollSpeed?: number;
|
|
32
|
-
minScale?: number;
|
|
33
|
-
maxScale?: number;
|
|
34
|
-
maxVelocity?: number;
|
|
35
|
-
getBlockingRects?: () => Rectangle[];
|
|
36
|
-
};
|
|
37
|
-
type AnimationTarget = Coord & {
|
|
38
|
-
scale: number;
|
|
39
|
-
alpha: number;
|
|
40
|
-
speed: number;
|
|
41
|
-
};
|
|
42
|
-
export declare class Artboard {
|
|
43
|
-
/**
|
|
44
|
-
* The element containing the artboard that can be moved and zoomed.
|
|
45
|
-
*/
|
|
46
|
-
artboardEl: HTMLElement;
|
|
47
|
-
/**
|
|
48
|
-
* The parent/root element that defines the area in which the artboard can be interacted with.
|
|
49
|
-
*/
|
|
50
|
-
rootEl: HTMLElement;
|
|
51
|
-
/**
|
|
52
|
-
* The minimum scale amount.
|
|
53
|
-
*/
|
|
54
|
-
minScale: number;
|
|
55
|
-
/**
|
|
56
|
-
* The maximum scale amount.
|
|
57
|
-
*/
|
|
58
|
-
maxScale: number;
|
|
59
|
-
/**
|
|
60
|
-
* The maximum move velocity.
|
|
61
|
-
*/
|
|
62
|
-
maxVelocity: number;
|
|
63
|
-
/**
|
|
64
|
-
* The current scale of the artboard.
|
|
65
|
-
*/
|
|
66
|
-
scale: number;
|
|
67
|
-
/**
|
|
68
|
-
* The padding area inside the root element.
|
|
69
|
-
*/
|
|
70
|
-
padding: number;
|
|
71
|
-
/**
|
|
72
|
-
* The multiplier for scrolling using the mouse wheel.
|
|
73
|
-
*/
|
|
74
|
-
scrollSpeed: number;
|
|
75
|
-
/**
|
|
76
|
-
* The current arboard offset/translation.
|
|
77
|
-
*/
|
|
78
|
-
offset: Coord;
|
|
79
|
-
/**
|
|
80
|
-
* The native size of the artboard (without any scaling).
|
|
81
|
-
*/
|
|
82
|
-
artboardSize: Size;
|
|
83
|
-
/**
|
|
84
|
-
* The native size of the root element.
|
|
85
|
-
*/
|
|
86
|
-
rootSize: Size;
|
|
87
|
-
/**
|
|
88
|
-
* The target state for the current animation.
|
|
89
|
-
*/
|
|
90
|
-
animationTarget: AnimationTarget | null;
|
|
91
|
-
/**
|
|
92
|
-
* The last touch coordinate (or the midpoint of two touches when scaling).
|
|
93
|
-
*/
|
|
94
|
-
lastTouch: Coord | null;
|
|
95
|
-
/**
|
|
96
|
-
* Whether the user is currently dragging the artboard.
|
|
97
|
-
*/
|
|
98
|
-
isDragging: boolean;
|
|
99
|
-
/**
|
|
100
|
-
* Whether the user is currently scaling the artboard using touch gestures.
|
|
101
|
-
*/
|
|
102
|
-
isScaling: boolean;
|
|
103
|
-
/**
|
|
104
|
-
* The calculated velocity of a drag gesture.
|
|
105
|
-
*/
|
|
106
|
-
velocity: Coord;
|
|
107
|
-
/**
|
|
108
|
-
* The queue containing the last touches to calculate the velocity.
|
|
109
|
-
*/
|
|
110
|
-
velocityQueue: VelocityQueue;
|
|
111
|
-
/**
|
|
112
|
-
* The calculated scale velocity.
|
|
113
|
-
*/
|
|
114
|
-
scaleVelocity: number;
|
|
115
|
-
/**
|
|
116
|
-
* The queue containing the last scaling values during a scale gesture.
|
|
117
|
-
*/
|
|
118
|
-
scaleVelocityQueue: ScaleVelocityQueue;
|
|
119
|
-
/**
|
|
120
|
-
* Whether the animation loop is performing momentum scrolling.
|
|
121
|
-
*/
|
|
122
|
-
isMomentumScrolling: boolean;
|
|
123
|
-
/**
|
|
124
|
-
* The detected touch direction.
|
|
125
|
-
*/
|
|
126
|
-
touchDirection: TouchDirection;
|
|
127
|
-
/**
|
|
128
|
-
* The coordinate at which the first touch event fired.
|
|
129
|
-
*/
|
|
130
|
-
initialTouchPoint: Coord | null;
|
|
131
|
-
/**
|
|
132
|
-
* The offset at the time the first touch event fired.
|
|
133
|
-
*/
|
|
134
|
-
initialOffset: Coord;
|
|
135
|
-
scaleMidpoint: Coord | null;
|
|
136
|
-
initialTouchDistance: number;
|
|
137
|
-
initialScale: number;
|
|
138
|
-
moveStartOffset: Coord | null;
|
|
139
|
-
moveStartCoords: Coord | null;
|
|
140
|
-
isPressingSpace: boolean;
|
|
141
|
-
/**
|
|
142
|
-
* Whether the user is currently touching the artboard with at least one finger.
|
|
143
|
-
*/
|
|
144
|
-
isTouching: boolean;
|
|
145
|
-
getBlockingRects: (() => Rectangle[]) | null;
|
|
146
|
-
listeners: Record<string, any>;
|
|
147
|
-
resizeObserver: ResizeObserver;
|
|
148
|
-
scaleStartCoords: Coord | null;
|
|
149
|
-
lastScaleTimestamp: number;
|
|
150
|
-
/**
|
|
151
|
-
* The timestamp of the last call to animateTo().
|
|
152
|
-
*/
|
|
153
|
-
lastAnimateToTimestamp: number;
|
|
154
|
-
/**
|
|
155
|
-
* Construct a new Artboard.
|
|
156
|
-
*/
|
|
157
|
-
constructor(el: HTMLElement, rootEl: HTMLElement, options?: ArtboardOptions);
|
|
158
|
-
setOptions(options: ArtboardOptions): void;
|
|
159
|
-
initListeners(): void;
|
|
160
|
-
onKeyDown(e: KeyboardEvent): void;
|
|
161
|
-
onKeyUp(): void;
|
|
162
|
-
onMouseDown(e: MouseEvent): void;
|
|
163
|
-
onMouseUp(): void;
|
|
164
|
-
onMouseMove(e: MouseEvent): void;
|
|
165
|
-
getDistance(a: Coord, b: Coord): number;
|
|
166
|
-
getTouchDistance(touches: PossibleDragEventPosition): number;
|
|
167
|
-
getMidpoint(touches: PossibleDragEventPosition): Coord;
|
|
168
|
-
onDragStart(touches: PossibleDragEventPosition): void;
|
|
169
|
-
onDragMove(touches: PossibleDragEventPosition): void;
|
|
170
|
-
resetDraggingState(): void;
|
|
171
|
-
onDragEnd(): void;
|
|
172
|
-
onTouchStart(e: TouchEvent): void;
|
|
173
|
-
onTouchMove(e: TouchEvent): void;
|
|
174
|
-
onTouchEnd(e: TouchEvent): void;
|
|
175
|
-
destroy(): void;
|
|
176
|
-
loop(): void;
|
|
177
|
-
getCenterX(targetScale?: number): number;
|
|
178
|
-
animateTo(x: number, y: number, targetScale?: number): void;
|
|
179
|
-
getEndY(): number;
|
|
180
|
-
animateOrJumpBy(y: number): void;
|
|
181
|
-
animateOrJumpTo(y: number): void;
|
|
182
|
-
scrollPageUp(): void;
|
|
183
|
-
scrollPageDown(): void;
|
|
184
|
-
scrollPageLeft(): void;
|
|
185
|
-
scrollPageRight(): void;
|
|
186
|
-
scrollToTop(): void;
|
|
187
|
-
scrollToEnd(): void;
|
|
188
|
-
scaleToFit(): void;
|
|
189
|
-
resetZoom(): void;
|
|
190
|
-
updateStyles(): void;
|
|
191
|
-
getBoundaries(providedScale?: number): {
|
|
192
|
-
xMin: number;
|
|
193
|
-
xMax: number;
|
|
194
|
-
yMin: number;
|
|
195
|
-
yMax: number;
|
|
196
|
-
};
|
|
197
|
-
setScale(newScale: number): void;
|
|
198
|
-
setOffset(x: number, y: number): void;
|
|
199
|
-
stopAnimate(): void;
|
|
200
|
-
scaleAroundPoint(x: number, y: number, newScale: number): void;
|
|
201
|
-
doZoom(x: number, y: number, delta: number): void;
|
|
202
|
-
onWheel(e: WheelEvent): void;
|
|
203
|
-
}
|
|
204
|
-
export {};
|