@uniformdev/canvas-vue 20.6.2-alpha.11 → 20.7.1-alpha.102
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/LICENSE.txt +1 -1
- package/dist/index.d.mts +237 -19
- package/dist/index.d.ts +237 -19
- package/dist/index.esm.js +67 -2
- package/dist/index.js +66 -4
- package/dist/index.mjs +67 -2
- package/package.json +7 -7
package/LICENSE.txt
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
©
|
|
1
|
+
© 2025 Uniform Systems, Inc. All Rights Reserved.
|
|
2
2
|
See details of Uniform Systems, Inc. Master Subscription Agreement here: https://uniform.dev/eula
|
package/dist/index.d.mts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as vue from 'vue';
|
|
2
2
|
import { PropType, Component, Ref, ComputedRef, VNode, Slot } from 'vue';
|
|
3
|
-
import { ComponentInstance, ComponentParameter, RootComponentInstance, UpdateCompositionMessage } from '@uniformdev/canvas';
|
|
3
|
+
import { ComponentInstance, ComponentParameter, RootComponentInstance, UpdateCompositionMessage, UpdateContextualEditingStateInternalMessage } from '@uniformdev/canvas';
|
|
4
4
|
export { GetParameterAttributesProps, createUniformApiEnhancer, getParameterAttributes } from '@uniformdev/canvas';
|
|
5
5
|
import { RichTextNode } from '@uniformdev/richtext';
|
|
6
6
|
|
|
@@ -217,7 +217,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
217
217
|
source?: string;
|
|
218
218
|
op: string;
|
|
219
219
|
value: string | string[];
|
|
220
|
-
} | any)[];
|
|
220
|
+
} | /*elided*/ any)[];
|
|
221
221
|
};
|
|
222
222
|
value: unknown;
|
|
223
223
|
id: number;
|
|
@@ -231,7 +231,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
231
231
|
source?: string;
|
|
232
232
|
op: string;
|
|
233
233
|
value: string | string[];
|
|
234
|
-
} | any)[];
|
|
234
|
+
} | /*elided*/ any)[];
|
|
235
235
|
};
|
|
236
236
|
value: unknown;
|
|
237
237
|
id: number;
|
|
@@ -250,6 +250,13 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
250
250
|
name: string;
|
|
251
251
|
value?: string;
|
|
252
252
|
helpText?: string;
|
|
253
|
+
optionsSource?: {
|
|
254
|
+
source: "static";
|
|
255
|
+
options: {
|
|
256
|
+
name: string;
|
|
257
|
+
value: string;
|
|
258
|
+
}[];
|
|
259
|
+
};
|
|
253
260
|
}[];
|
|
254
261
|
previewValue?: string;
|
|
255
262
|
};
|
|
@@ -285,7 +292,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
285
292
|
source?: string;
|
|
286
293
|
op: string;
|
|
287
294
|
value: string | string[];
|
|
288
|
-
} | any)[];
|
|
295
|
+
} | /*elided*/ any)[];
|
|
289
296
|
};
|
|
290
297
|
value: unknown;
|
|
291
298
|
id: number;
|
|
@@ -299,7 +306,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
299
306
|
source?: string;
|
|
300
307
|
op: string;
|
|
301
308
|
value: string | string[];
|
|
302
|
-
} | any)[];
|
|
309
|
+
} | /*elided*/ any)[];
|
|
303
310
|
};
|
|
304
311
|
value: unknown;
|
|
305
312
|
id: number;
|
|
@@ -309,7 +316,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
309
316
|
};
|
|
310
317
|
variant?: string;
|
|
311
318
|
slots?: {
|
|
312
|
-
[key: string]: any[];
|
|
319
|
+
[key: string]: /*elided*/ any[];
|
|
313
320
|
};
|
|
314
321
|
_id?: string;
|
|
315
322
|
_pattern?: string;
|
|
@@ -360,7 +367,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
360
367
|
source?: string;
|
|
361
368
|
op: string;
|
|
362
369
|
value: string | string[];
|
|
363
|
-
} | any)[];
|
|
370
|
+
} | /*elided*/ any)[];
|
|
364
371
|
};
|
|
365
372
|
value: unknown;
|
|
366
373
|
id: number;
|
|
@@ -374,7 +381,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
374
381
|
source?: string;
|
|
375
382
|
op: string;
|
|
376
383
|
value: string | string[];
|
|
377
|
-
} | any)[];
|
|
384
|
+
} | /*elided*/ any)[];
|
|
378
385
|
};
|
|
379
386
|
value: unknown;
|
|
380
387
|
id: number;
|
|
@@ -383,7 +390,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
383
390
|
};
|
|
384
391
|
};
|
|
385
392
|
slots?: {
|
|
386
|
-
[key: string]: any[];
|
|
393
|
+
[key: string]: /*elided*/ any[];
|
|
387
394
|
};
|
|
388
395
|
variant?: string;
|
|
389
396
|
dataResources?: {
|
|
@@ -423,7 +430,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
423
430
|
source?: string;
|
|
424
431
|
op: string;
|
|
425
432
|
value: string | string[];
|
|
426
|
-
} | any)[];
|
|
433
|
+
} | /*elided*/ any)[];
|
|
427
434
|
};
|
|
428
435
|
value: unknown;
|
|
429
436
|
id: number;
|
|
@@ -437,7 +444,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
437
444
|
source?: string;
|
|
438
445
|
op: string;
|
|
439
446
|
value: string | string[];
|
|
440
|
-
} | any)[];
|
|
447
|
+
} | /*elided*/ any)[];
|
|
441
448
|
};
|
|
442
449
|
value: unknown;
|
|
443
450
|
id: number;
|
|
@@ -446,7 +453,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
446
453
|
};
|
|
447
454
|
};
|
|
448
455
|
slots?: {
|
|
449
|
-
[key: string]: any[];
|
|
456
|
+
[key: string]: /*elided*/ any[];
|
|
450
457
|
};
|
|
451
458
|
variant?: string;
|
|
452
459
|
dataResources?: {
|
|
@@ -527,7 +534,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
527
534
|
source?: string;
|
|
528
535
|
op: string;
|
|
529
536
|
value: string | string[];
|
|
530
|
-
} | any)[];
|
|
537
|
+
} | /*elided*/ any)[];
|
|
531
538
|
};
|
|
532
539
|
value: unknown;
|
|
533
540
|
id: number;
|
|
@@ -541,7 +548,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
541
548
|
source?: string;
|
|
542
549
|
op: string;
|
|
543
550
|
value: string | string[];
|
|
544
|
-
} | any)[];
|
|
551
|
+
} | /*elided*/ any)[];
|
|
545
552
|
};
|
|
546
553
|
value: unknown;
|
|
547
554
|
id: number;
|
|
@@ -550,7 +557,96 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
550
557
|
};
|
|
551
558
|
};
|
|
552
559
|
slots?: {
|
|
553
|
-
[key: string]:
|
|
560
|
+
[key: string]: {
|
|
561
|
+
type: string;
|
|
562
|
+
parameters?: {
|
|
563
|
+
[key: string]: {
|
|
564
|
+
value?: unknown;
|
|
565
|
+
type: string;
|
|
566
|
+
connectedData?: {
|
|
567
|
+
pointer: string;
|
|
568
|
+
syntax: "jptr";
|
|
569
|
+
failureAction?: "t" | "p" | "c" | "a";
|
|
570
|
+
failureLogLevel?: "e" | "w" | "i";
|
|
571
|
+
failureDefault?: string;
|
|
572
|
+
};
|
|
573
|
+
locales?: {
|
|
574
|
+
[key: string]: unknown;
|
|
575
|
+
};
|
|
576
|
+
conditions?: {
|
|
577
|
+
when: {
|
|
578
|
+
op?: "&" | "|";
|
|
579
|
+
clauses: ({
|
|
580
|
+
rule: string;
|
|
581
|
+
source?: string;
|
|
582
|
+
op: string;
|
|
583
|
+
value: string | string[];
|
|
584
|
+
} | /*elided*/ any)[];
|
|
585
|
+
};
|
|
586
|
+
value: unknown;
|
|
587
|
+
id: number;
|
|
588
|
+
}[];
|
|
589
|
+
localesConditions?: {
|
|
590
|
+
[key: string]: {
|
|
591
|
+
when: {
|
|
592
|
+
op?: "&" | "|";
|
|
593
|
+
clauses: ({
|
|
594
|
+
rule: string;
|
|
595
|
+
source?: string;
|
|
596
|
+
op: string;
|
|
597
|
+
value: string | string[];
|
|
598
|
+
} | /*elided*/ any)[];
|
|
599
|
+
};
|
|
600
|
+
value: unknown;
|
|
601
|
+
id: number;
|
|
602
|
+
}[];
|
|
603
|
+
};
|
|
604
|
+
};
|
|
605
|
+
};
|
|
606
|
+
variant?: string;
|
|
607
|
+
slots?: {
|
|
608
|
+
[key: string]: /*elided*/ any[];
|
|
609
|
+
};
|
|
610
|
+
_id?: string;
|
|
611
|
+
_pattern?: string;
|
|
612
|
+
_dataResources?: {
|
|
613
|
+
[key: string]: {
|
|
614
|
+
type: string;
|
|
615
|
+
isPatternParameter?: boolean;
|
|
616
|
+
ignorePatternParameterDefault?: boolean;
|
|
617
|
+
optionalPatternParameter?: boolean;
|
|
618
|
+
variables?: {
|
|
619
|
+
[key: string]: string;
|
|
620
|
+
};
|
|
621
|
+
};
|
|
622
|
+
};
|
|
623
|
+
_patternDataResources?: {
|
|
624
|
+
[key: string]: {
|
|
625
|
+
type: string;
|
|
626
|
+
isPatternParameter?: boolean;
|
|
627
|
+
ignorePatternParameterDefault?: boolean;
|
|
628
|
+
optionalPatternParameter?: boolean;
|
|
629
|
+
variables?: {
|
|
630
|
+
[key: string]: string;
|
|
631
|
+
};
|
|
632
|
+
};
|
|
633
|
+
};
|
|
634
|
+
_patternError?: "NOTFOUND" | "CYCLIC";
|
|
635
|
+
_overrides?: {
|
|
636
|
+
[key: string]: /*elided*/ any;
|
|
637
|
+
};
|
|
638
|
+
_patternOverrides?: {
|
|
639
|
+
[key: string]: /*elided*/ any;
|
|
640
|
+
};
|
|
641
|
+
_overridability?: {
|
|
642
|
+
parameters?: {
|
|
643
|
+
[key: string]: "yes" | "no";
|
|
644
|
+
};
|
|
645
|
+
variants?: boolean;
|
|
646
|
+
hideLockedParameters?: boolean;
|
|
647
|
+
};
|
|
648
|
+
_locales?: string[];
|
|
649
|
+
}[];
|
|
554
650
|
};
|
|
555
651
|
variant?: string;
|
|
556
652
|
dataResources?: {
|
|
@@ -590,7 +686,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
590
686
|
source?: string;
|
|
591
687
|
op: string;
|
|
592
688
|
value: string | string[];
|
|
593
|
-
} | any)[];
|
|
689
|
+
} | /*elided*/ any)[];
|
|
594
690
|
};
|
|
595
691
|
value: unknown;
|
|
596
692
|
id: number;
|
|
@@ -604,7 +700,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
604
700
|
source?: string;
|
|
605
701
|
op: string;
|
|
606
702
|
value: string | string[];
|
|
607
|
-
} | any)[];
|
|
703
|
+
} | /*elided*/ any)[];
|
|
608
704
|
};
|
|
609
705
|
value: unknown;
|
|
610
706
|
id: number;
|
|
@@ -613,7 +709,96 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
613
709
|
};
|
|
614
710
|
};
|
|
615
711
|
slots?: {
|
|
616
|
-
[key: string]:
|
|
712
|
+
[key: string]: {
|
|
713
|
+
type: string;
|
|
714
|
+
parameters?: {
|
|
715
|
+
[key: string]: {
|
|
716
|
+
value?: unknown;
|
|
717
|
+
type: string;
|
|
718
|
+
connectedData?: {
|
|
719
|
+
pointer: string;
|
|
720
|
+
syntax: "jptr";
|
|
721
|
+
failureAction?: "t" | "p" | "c" | "a";
|
|
722
|
+
failureLogLevel?: "e" | "w" | "i";
|
|
723
|
+
failureDefault?: string;
|
|
724
|
+
};
|
|
725
|
+
locales?: {
|
|
726
|
+
[key: string]: unknown;
|
|
727
|
+
};
|
|
728
|
+
conditions?: {
|
|
729
|
+
when: {
|
|
730
|
+
op?: "&" | "|";
|
|
731
|
+
clauses: ({
|
|
732
|
+
rule: string;
|
|
733
|
+
source?: string;
|
|
734
|
+
op: string;
|
|
735
|
+
value: string | string[];
|
|
736
|
+
} | /*elided*/ any)[];
|
|
737
|
+
};
|
|
738
|
+
value: unknown;
|
|
739
|
+
id: number;
|
|
740
|
+
}[];
|
|
741
|
+
localesConditions?: {
|
|
742
|
+
[key: string]: {
|
|
743
|
+
when: {
|
|
744
|
+
op?: "&" | "|";
|
|
745
|
+
clauses: ({
|
|
746
|
+
rule: string;
|
|
747
|
+
source?: string;
|
|
748
|
+
op: string;
|
|
749
|
+
value: string | string[];
|
|
750
|
+
} | /*elided*/ any)[];
|
|
751
|
+
};
|
|
752
|
+
value: unknown;
|
|
753
|
+
id: number;
|
|
754
|
+
}[];
|
|
755
|
+
};
|
|
756
|
+
};
|
|
757
|
+
};
|
|
758
|
+
variant?: string;
|
|
759
|
+
slots?: {
|
|
760
|
+
[key: string]: /*elided*/ any[];
|
|
761
|
+
};
|
|
762
|
+
_id?: string;
|
|
763
|
+
_pattern?: string;
|
|
764
|
+
_dataResources?: {
|
|
765
|
+
[key: string]: {
|
|
766
|
+
type: string;
|
|
767
|
+
isPatternParameter?: boolean;
|
|
768
|
+
ignorePatternParameterDefault?: boolean;
|
|
769
|
+
optionalPatternParameter?: boolean;
|
|
770
|
+
variables?: {
|
|
771
|
+
[key: string]: string;
|
|
772
|
+
};
|
|
773
|
+
};
|
|
774
|
+
};
|
|
775
|
+
_patternDataResources?: {
|
|
776
|
+
[key: string]: {
|
|
777
|
+
type: string;
|
|
778
|
+
isPatternParameter?: boolean;
|
|
779
|
+
ignorePatternParameterDefault?: boolean;
|
|
780
|
+
optionalPatternParameter?: boolean;
|
|
781
|
+
variables?: {
|
|
782
|
+
[key: string]: string;
|
|
783
|
+
};
|
|
784
|
+
};
|
|
785
|
+
};
|
|
786
|
+
_patternError?: "NOTFOUND" | "CYCLIC";
|
|
787
|
+
_overrides?: {
|
|
788
|
+
[key: string]: /*elided*/ any;
|
|
789
|
+
};
|
|
790
|
+
_patternOverrides?: {
|
|
791
|
+
[key: string]: /*elided*/ any;
|
|
792
|
+
};
|
|
793
|
+
_overridability?: {
|
|
794
|
+
parameters?: {
|
|
795
|
+
[key: string]: "yes" | "no";
|
|
796
|
+
};
|
|
797
|
+
variants?: boolean;
|
|
798
|
+
hideLockedParameters?: boolean;
|
|
799
|
+
};
|
|
800
|
+
_locales?: string[];
|
|
801
|
+
}[];
|
|
617
802
|
};
|
|
618
803
|
variant?: string;
|
|
619
804
|
dataResources?: {
|
|
@@ -860,6 +1045,39 @@ declare function renderComponent({ component, resolveRenderer, indexInSlot, slot
|
|
|
860
1045
|
emptyPlaceholder?: Slot;
|
|
861
1046
|
}): Component<any>;
|
|
862
1047
|
|
|
1048
|
+
type UseUniformContextualEditingStateProps = {
|
|
1049
|
+
/**
|
|
1050
|
+
* When set to true, the hook will return the global contextual state no matter where its used.
|
|
1051
|
+
* When set to false, it will return only the state relevant to the current component (determined using `useUniformCurrentComponent`).
|
|
1052
|
+
* @default false
|
|
1053
|
+
**/
|
|
1054
|
+
global?: boolean;
|
|
1055
|
+
};
|
|
1056
|
+
type UseUniformContextualEditingStateReturnType = {
|
|
1057
|
+
/**
|
|
1058
|
+
* Returns `true` when the app is rendered inside Canvas editor. Regardless of which preview mode is currently selected ("editor" or "preview").
|
|
1059
|
+
*/
|
|
1060
|
+
isContextualEditing: Ref<boolean> | undefined;
|
|
1061
|
+
/**
|
|
1062
|
+
* A reference to the currently selected component in Canvas editor.
|
|
1063
|
+
* Returns `undefined` if the selected component is not part of the current React component.
|
|
1064
|
+
* Set the `global` option to `true` to get a reference of the selected component anywhere in the composition tree.
|
|
1065
|
+
*/
|
|
1066
|
+
selectedComponentReference: Ref<UpdateContextualEditingStateInternalMessage['state']['selectedComponentReference']>;
|
|
1067
|
+
/**
|
|
1068
|
+
* Returns the current preview mode in Canvas editor ("editor" or "preview").
|
|
1069
|
+
* Returns `undefined` when the app is not rendered inside Canvas editor.
|
|
1070
|
+
* Learn more about the preview modes: https://docs.uniform.app/docs/guides/composition/visual-editing#editing-and-preview-mode
|
|
1071
|
+
*/
|
|
1072
|
+
previewMode: Ref<UpdateContextualEditingStateInternalMessage['state']['previewMode'] | undefined>;
|
|
1073
|
+
};
|
|
1074
|
+
/**
|
|
1075
|
+
* Returns the state of contextual editing, when the app is open inside Canvas Editor.
|
|
1076
|
+
* This hook can be used to improve the editing experience of your team.
|
|
1077
|
+
* For example: You can use `selectedComponentReference` to control which element to show inside a carousel or an accordion.
|
|
1078
|
+
*/
|
|
1079
|
+
declare const useUniformContextualEditingState: ({ global: isGlobal, }?: UseUniformContextualEditingStateProps) => UseUniformContextualEditingStateReturnType;
|
|
1080
|
+
|
|
863
1081
|
declare const globalCompositionEnhancerInjectionKey = "uniformGlobalCompositionEnhancer";
|
|
864
1082
|
|
|
865
1083
|
/**
|
|
@@ -870,4 +1088,4 @@ declare const globalCompositionEnhancerInjectionKey = "uniformGlobalCompositionE
|
|
|
870
1088
|
*/
|
|
871
1089
|
declare function convertComponentToProps<T = unknown>(component: ComponentInstance): ComponentProps<T>;
|
|
872
1090
|
|
|
873
|
-
export { type ComponentProps, DefaultNotImplementedComponent, type DefaultNotImplementedComponentProps, HeadingRichTextNode, LinkRichTextNode, ListItemRichTextNode, ListRichTextNode, ParagraphRichTextNode, type PersonalizeComponent, QuoteRichTextNode, type RenderRichTextComponentResolver, type ResolveRenderer, type RichTextComponentProps, type RichTextRendererComponent, RootRichTextNode, TableCellRichTextNode, TableRichTextNode, TableRowRichTextNode, type TestComponent, TextRichTextNode, UniformComponent, type UniformComponentProps, UniformComposition, type UniformCompositionProps, UniformPlayground, type UniformPlaygroundProps, UniformRichText, UniformRichTextNode, type UniformRichTextNodeProps, type UniformRichTextProps, UniformSlot, type UniformSlotProps, UniformText, type UniformTextProps, type UseUniformContextualEditingProps, convertComponentToProps, globalCompositionEnhancerInjectionKey, renderComponent, useUniformContextualEditing, useUniformCurrentComponent, useUniformCurrentComposition };
|
|
1091
|
+
export { type ComponentProps, DefaultNotImplementedComponent, type DefaultNotImplementedComponentProps, HeadingRichTextNode, LinkRichTextNode, ListItemRichTextNode, ListRichTextNode, ParagraphRichTextNode, type PersonalizeComponent, QuoteRichTextNode, type RenderRichTextComponentResolver, type ResolveRenderer, type RichTextComponentProps, type RichTextRendererComponent, RootRichTextNode, TableCellRichTextNode, TableRichTextNode, TableRowRichTextNode, type TestComponent, TextRichTextNode, UniformComponent, type UniformComponentProps, UniformComposition, type UniformCompositionProps, UniformPlayground, type UniformPlaygroundProps, UniformRichText, UniformRichTextNode, type UniformRichTextNodeProps, type UniformRichTextProps, UniformSlot, type UniformSlotProps, UniformText, type UniformTextProps, type UseUniformContextualEditingProps, type UseUniformContextualEditingStateProps, type UseUniformContextualEditingStateReturnType, convertComponentToProps, globalCompositionEnhancerInjectionKey, renderComponent, useUniformContextualEditing, useUniformContextualEditingState, useUniformCurrentComponent, useUniformCurrentComposition };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as vue from 'vue';
|
|
2
2
|
import { PropType, Component, Ref, ComputedRef, VNode, Slot } from 'vue';
|
|
3
|
-
import { ComponentInstance, ComponentParameter, RootComponentInstance, UpdateCompositionMessage } from '@uniformdev/canvas';
|
|
3
|
+
import { ComponentInstance, ComponentParameter, RootComponentInstance, UpdateCompositionMessage, UpdateContextualEditingStateInternalMessage } from '@uniformdev/canvas';
|
|
4
4
|
export { GetParameterAttributesProps, createUniformApiEnhancer, getParameterAttributes } from '@uniformdev/canvas';
|
|
5
5
|
import { RichTextNode } from '@uniformdev/richtext';
|
|
6
6
|
|
|
@@ -217,7 +217,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
217
217
|
source?: string;
|
|
218
218
|
op: string;
|
|
219
219
|
value: string | string[];
|
|
220
|
-
} | any)[];
|
|
220
|
+
} | /*elided*/ any)[];
|
|
221
221
|
};
|
|
222
222
|
value: unknown;
|
|
223
223
|
id: number;
|
|
@@ -231,7 +231,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
231
231
|
source?: string;
|
|
232
232
|
op: string;
|
|
233
233
|
value: string | string[];
|
|
234
|
-
} | any)[];
|
|
234
|
+
} | /*elided*/ any)[];
|
|
235
235
|
};
|
|
236
236
|
value: unknown;
|
|
237
237
|
id: number;
|
|
@@ -250,6 +250,13 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
250
250
|
name: string;
|
|
251
251
|
value?: string;
|
|
252
252
|
helpText?: string;
|
|
253
|
+
optionsSource?: {
|
|
254
|
+
source: "static";
|
|
255
|
+
options: {
|
|
256
|
+
name: string;
|
|
257
|
+
value: string;
|
|
258
|
+
}[];
|
|
259
|
+
};
|
|
253
260
|
}[];
|
|
254
261
|
previewValue?: string;
|
|
255
262
|
};
|
|
@@ -285,7 +292,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
285
292
|
source?: string;
|
|
286
293
|
op: string;
|
|
287
294
|
value: string | string[];
|
|
288
|
-
} | any)[];
|
|
295
|
+
} | /*elided*/ any)[];
|
|
289
296
|
};
|
|
290
297
|
value: unknown;
|
|
291
298
|
id: number;
|
|
@@ -299,7 +306,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
299
306
|
source?: string;
|
|
300
307
|
op: string;
|
|
301
308
|
value: string | string[];
|
|
302
|
-
} | any)[];
|
|
309
|
+
} | /*elided*/ any)[];
|
|
303
310
|
};
|
|
304
311
|
value: unknown;
|
|
305
312
|
id: number;
|
|
@@ -309,7 +316,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
309
316
|
};
|
|
310
317
|
variant?: string;
|
|
311
318
|
slots?: {
|
|
312
|
-
[key: string]: any[];
|
|
319
|
+
[key: string]: /*elided*/ any[];
|
|
313
320
|
};
|
|
314
321
|
_id?: string;
|
|
315
322
|
_pattern?: string;
|
|
@@ -360,7 +367,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
360
367
|
source?: string;
|
|
361
368
|
op: string;
|
|
362
369
|
value: string | string[];
|
|
363
|
-
} | any)[];
|
|
370
|
+
} | /*elided*/ any)[];
|
|
364
371
|
};
|
|
365
372
|
value: unknown;
|
|
366
373
|
id: number;
|
|
@@ -374,7 +381,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
374
381
|
source?: string;
|
|
375
382
|
op: string;
|
|
376
383
|
value: string | string[];
|
|
377
|
-
} | any)[];
|
|
384
|
+
} | /*elided*/ any)[];
|
|
378
385
|
};
|
|
379
386
|
value: unknown;
|
|
380
387
|
id: number;
|
|
@@ -383,7 +390,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
383
390
|
};
|
|
384
391
|
};
|
|
385
392
|
slots?: {
|
|
386
|
-
[key: string]: any[];
|
|
393
|
+
[key: string]: /*elided*/ any[];
|
|
387
394
|
};
|
|
388
395
|
variant?: string;
|
|
389
396
|
dataResources?: {
|
|
@@ -423,7 +430,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
423
430
|
source?: string;
|
|
424
431
|
op: string;
|
|
425
432
|
value: string | string[];
|
|
426
|
-
} | any)[];
|
|
433
|
+
} | /*elided*/ any)[];
|
|
427
434
|
};
|
|
428
435
|
value: unknown;
|
|
429
436
|
id: number;
|
|
@@ -437,7 +444,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
437
444
|
source?: string;
|
|
438
445
|
op: string;
|
|
439
446
|
value: string | string[];
|
|
440
|
-
} | any)[];
|
|
447
|
+
} | /*elided*/ any)[];
|
|
441
448
|
};
|
|
442
449
|
value: unknown;
|
|
443
450
|
id: number;
|
|
@@ -446,7 +453,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
446
453
|
};
|
|
447
454
|
};
|
|
448
455
|
slots?: {
|
|
449
|
-
[key: string]: any[];
|
|
456
|
+
[key: string]: /*elided*/ any[];
|
|
450
457
|
};
|
|
451
458
|
variant?: string;
|
|
452
459
|
dataResources?: {
|
|
@@ -527,7 +534,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
527
534
|
source?: string;
|
|
528
535
|
op: string;
|
|
529
536
|
value: string | string[];
|
|
530
|
-
} | any)[];
|
|
537
|
+
} | /*elided*/ any)[];
|
|
531
538
|
};
|
|
532
539
|
value: unknown;
|
|
533
540
|
id: number;
|
|
@@ -541,7 +548,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
541
548
|
source?: string;
|
|
542
549
|
op: string;
|
|
543
550
|
value: string | string[];
|
|
544
|
-
} | any)[];
|
|
551
|
+
} | /*elided*/ any)[];
|
|
545
552
|
};
|
|
546
553
|
value: unknown;
|
|
547
554
|
id: number;
|
|
@@ -550,7 +557,96 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
550
557
|
};
|
|
551
558
|
};
|
|
552
559
|
slots?: {
|
|
553
|
-
[key: string]:
|
|
560
|
+
[key: string]: {
|
|
561
|
+
type: string;
|
|
562
|
+
parameters?: {
|
|
563
|
+
[key: string]: {
|
|
564
|
+
value?: unknown;
|
|
565
|
+
type: string;
|
|
566
|
+
connectedData?: {
|
|
567
|
+
pointer: string;
|
|
568
|
+
syntax: "jptr";
|
|
569
|
+
failureAction?: "t" | "p" | "c" | "a";
|
|
570
|
+
failureLogLevel?: "e" | "w" | "i";
|
|
571
|
+
failureDefault?: string;
|
|
572
|
+
};
|
|
573
|
+
locales?: {
|
|
574
|
+
[key: string]: unknown;
|
|
575
|
+
};
|
|
576
|
+
conditions?: {
|
|
577
|
+
when: {
|
|
578
|
+
op?: "&" | "|";
|
|
579
|
+
clauses: ({
|
|
580
|
+
rule: string;
|
|
581
|
+
source?: string;
|
|
582
|
+
op: string;
|
|
583
|
+
value: string | string[];
|
|
584
|
+
} | /*elided*/ any)[];
|
|
585
|
+
};
|
|
586
|
+
value: unknown;
|
|
587
|
+
id: number;
|
|
588
|
+
}[];
|
|
589
|
+
localesConditions?: {
|
|
590
|
+
[key: string]: {
|
|
591
|
+
when: {
|
|
592
|
+
op?: "&" | "|";
|
|
593
|
+
clauses: ({
|
|
594
|
+
rule: string;
|
|
595
|
+
source?: string;
|
|
596
|
+
op: string;
|
|
597
|
+
value: string | string[];
|
|
598
|
+
} | /*elided*/ any)[];
|
|
599
|
+
};
|
|
600
|
+
value: unknown;
|
|
601
|
+
id: number;
|
|
602
|
+
}[];
|
|
603
|
+
};
|
|
604
|
+
};
|
|
605
|
+
};
|
|
606
|
+
variant?: string;
|
|
607
|
+
slots?: {
|
|
608
|
+
[key: string]: /*elided*/ any[];
|
|
609
|
+
};
|
|
610
|
+
_id?: string;
|
|
611
|
+
_pattern?: string;
|
|
612
|
+
_dataResources?: {
|
|
613
|
+
[key: string]: {
|
|
614
|
+
type: string;
|
|
615
|
+
isPatternParameter?: boolean;
|
|
616
|
+
ignorePatternParameterDefault?: boolean;
|
|
617
|
+
optionalPatternParameter?: boolean;
|
|
618
|
+
variables?: {
|
|
619
|
+
[key: string]: string;
|
|
620
|
+
};
|
|
621
|
+
};
|
|
622
|
+
};
|
|
623
|
+
_patternDataResources?: {
|
|
624
|
+
[key: string]: {
|
|
625
|
+
type: string;
|
|
626
|
+
isPatternParameter?: boolean;
|
|
627
|
+
ignorePatternParameterDefault?: boolean;
|
|
628
|
+
optionalPatternParameter?: boolean;
|
|
629
|
+
variables?: {
|
|
630
|
+
[key: string]: string;
|
|
631
|
+
};
|
|
632
|
+
};
|
|
633
|
+
};
|
|
634
|
+
_patternError?: "NOTFOUND" | "CYCLIC";
|
|
635
|
+
_overrides?: {
|
|
636
|
+
[key: string]: /*elided*/ any;
|
|
637
|
+
};
|
|
638
|
+
_patternOverrides?: {
|
|
639
|
+
[key: string]: /*elided*/ any;
|
|
640
|
+
};
|
|
641
|
+
_overridability?: {
|
|
642
|
+
parameters?: {
|
|
643
|
+
[key: string]: "yes" | "no";
|
|
644
|
+
};
|
|
645
|
+
variants?: boolean;
|
|
646
|
+
hideLockedParameters?: boolean;
|
|
647
|
+
};
|
|
648
|
+
_locales?: string[];
|
|
649
|
+
}[];
|
|
554
650
|
};
|
|
555
651
|
variant?: string;
|
|
556
652
|
dataResources?: {
|
|
@@ -590,7 +686,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
590
686
|
source?: string;
|
|
591
687
|
op: string;
|
|
592
688
|
value: string | string[];
|
|
593
|
-
} | any)[];
|
|
689
|
+
} | /*elided*/ any)[];
|
|
594
690
|
};
|
|
595
691
|
value: unknown;
|
|
596
692
|
id: number;
|
|
@@ -604,7 +700,7 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
604
700
|
source?: string;
|
|
605
701
|
op: string;
|
|
606
702
|
value: string | string[];
|
|
607
|
-
} | any)[];
|
|
703
|
+
} | /*elided*/ any)[];
|
|
608
704
|
};
|
|
609
705
|
value: unknown;
|
|
610
706
|
id: number;
|
|
@@ -613,7 +709,96 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
|
|
|
613
709
|
};
|
|
614
710
|
};
|
|
615
711
|
slots?: {
|
|
616
|
-
[key: string]:
|
|
712
|
+
[key: string]: {
|
|
713
|
+
type: string;
|
|
714
|
+
parameters?: {
|
|
715
|
+
[key: string]: {
|
|
716
|
+
value?: unknown;
|
|
717
|
+
type: string;
|
|
718
|
+
connectedData?: {
|
|
719
|
+
pointer: string;
|
|
720
|
+
syntax: "jptr";
|
|
721
|
+
failureAction?: "t" | "p" | "c" | "a";
|
|
722
|
+
failureLogLevel?: "e" | "w" | "i";
|
|
723
|
+
failureDefault?: string;
|
|
724
|
+
};
|
|
725
|
+
locales?: {
|
|
726
|
+
[key: string]: unknown;
|
|
727
|
+
};
|
|
728
|
+
conditions?: {
|
|
729
|
+
when: {
|
|
730
|
+
op?: "&" | "|";
|
|
731
|
+
clauses: ({
|
|
732
|
+
rule: string;
|
|
733
|
+
source?: string;
|
|
734
|
+
op: string;
|
|
735
|
+
value: string | string[];
|
|
736
|
+
} | /*elided*/ any)[];
|
|
737
|
+
};
|
|
738
|
+
value: unknown;
|
|
739
|
+
id: number;
|
|
740
|
+
}[];
|
|
741
|
+
localesConditions?: {
|
|
742
|
+
[key: string]: {
|
|
743
|
+
when: {
|
|
744
|
+
op?: "&" | "|";
|
|
745
|
+
clauses: ({
|
|
746
|
+
rule: string;
|
|
747
|
+
source?: string;
|
|
748
|
+
op: string;
|
|
749
|
+
value: string | string[];
|
|
750
|
+
} | /*elided*/ any)[];
|
|
751
|
+
};
|
|
752
|
+
value: unknown;
|
|
753
|
+
id: number;
|
|
754
|
+
}[];
|
|
755
|
+
};
|
|
756
|
+
};
|
|
757
|
+
};
|
|
758
|
+
variant?: string;
|
|
759
|
+
slots?: {
|
|
760
|
+
[key: string]: /*elided*/ any[];
|
|
761
|
+
};
|
|
762
|
+
_id?: string;
|
|
763
|
+
_pattern?: string;
|
|
764
|
+
_dataResources?: {
|
|
765
|
+
[key: string]: {
|
|
766
|
+
type: string;
|
|
767
|
+
isPatternParameter?: boolean;
|
|
768
|
+
ignorePatternParameterDefault?: boolean;
|
|
769
|
+
optionalPatternParameter?: boolean;
|
|
770
|
+
variables?: {
|
|
771
|
+
[key: string]: string;
|
|
772
|
+
};
|
|
773
|
+
};
|
|
774
|
+
};
|
|
775
|
+
_patternDataResources?: {
|
|
776
|
+
[key: string]: {
|
|
777
|
+
type: string;
|
|
778
|
+
isPatternParameter?: boolean;
|
|
779
|
+
ignorePatternParameterDefault?: boolean;
|
|
780
|
+
optionalPatternParameter?: boolean;
|
|
781
|
+
variables?: {
|
|
782
|
+
[key: string]: string;
|
|
783
|
+
};
|
|
784
|
+
};
|
|
785
|
+
};
|
|
786
|
+
_patternError?: "NOTFOUND" | "CYCLIC";
|
|
787
|
+
_overrides?: {
|
|
788
|
+
[key: string]: /*elided*/ any;
|
|
789
|
+
};
|
|
790
|
+
_patternOverrides?: {
|
|
791
|
+
[key: string]: /*elided*/ any;
|
|
792
|
+
};
|
|
793
|
+
_overridability?: {
|
|
794
|
+
parameters?: {
|
|
795
|
+
[key: string]: "yes" | "no";
|
|
796
|
+
};
|
|
797
|
+
variants?: boolean;
|
|
798
|
+
hideLockedParameters?: boolean;
|
|
799
|
+
};
|
|
800
|
+
_locales?: string[];
|
|
801
|
+
}[];
|
|
617
802
|
};
|
|
618
803
|
variant?: string;
|
|
619
804
|
dataResources?: {
|
|
@@ -860,6 +1045,39 @@ declare function renderComponent({ component, resolveRenderer, indexInSlot, slot
|
|
|
860
1045
|
emptyPlaceholder?: Slot;
|
|
861
1046
|
}): Component<any>;
|
|
862
1047
|
|
|
1048
|
+
type UseUniformContextualEditingStateProps = {
|
|
1049
|
+
/**
|
|
1050
|
+
* When set to true, the hook will return the global contextual state no matter where its used.
|
|
1051
|
+
* When set to false, it will return only the state relevant to the current component (determined using `useUniformCurrentComponent`).
|
|
1052
|
+
* @default false
|
|
1053
|
+
**/
|
|
1054
|
+
global?: boolean;
|
|
1055
|
+
};
|
|
1056
|
+
type UseUniformContextualEditingStateReturnType = {
|
|
1057
|
+
/**
|
|
1058
|
+
* Returns `true` when the app is rendered inside Canvas editor. Regardless of which preview mode is currently selected ("editor" or "preview").
|
|
1059
|
+
*/
|
|
1060
|
+
isContextualEditing: Ref<boolean> | undefined;
|
|
1061
|
+
/**
|
|
1062
|
+
* A reference to the currently selected component in Canvas editor.
|
|
1063
|
+
* Returns `undefined` if the selected component is not part of the current React component.
|
|
1064
|
+
* Set the `global` option to `true` to get a reference of the selected component anywhere in the composition tree.
|
|
1065
|
+
*/
|
|
1066
|
+
selectedComponentReference: Ref<UpdateContextualEditingStateInternalMessage['state']['selectedComponentReference']>;
|
|
1067
|
+
/**
|
|
1068
|
+
* Returns the current preview mode in Canvas editor ("editor" or "preview").
|
|
1069
|
+
* Returns `undefined` when the app is not rendered inside Canvas editor.
|
|
1070
|
+
* Learn more about the preview modes: https://docs.uniform.app/docs/guides/composition/visual-editing#editing-and-preview-mode
|
|
1071
|
+
*/
|
|
1072
|
+
previewMode: Ref<UpdateContextualEditingStateInternalMessage['state']['previewMode'] | undefined>;
|
|
1073
|
+
};
|
|
1074
|
+
/**
|
|
1075
|
+
* Returns the state of contextual editing, when the app is open inside Canvas Editor.
|
|
1076
|
+
* This hook can be used to improve the editing experience of your team.
|
|
1077
|
+
* For example: You can use `selectedComponentReference` to control which element to show inside a carousel or an accordion.
|
|
1078
|
+
*/
|
|
1079
|
+
declare const useUniformContextualEditingState: ({ global: isGlobal, }?: UseUniformContextualEditingStateProps) => UseUniformContextualEditingStateReturnType;
|
|
1080
|
+
|
|
863
1081
|
declare const globalCompositionEnhancerInjectionKey = "uniformGlobalCompositionEnhancer";
|
|
864
1082
|
|
|
865
1083
|
/**
|
|
@@ -870,4 +1088,4 @@ declare const globalCompositionEnhancerInjectionKey = "uniformGlobalCompositionE
|
|
|
870
1088
|
*/
|
|
871
1089
|
declare function convertComponentToProps<T = unknown>(component: ComponentInstance): ComponentProps<T>;
|
|
872
1090
|
|
|
873
|
-
export { type ComponentProps, DefaultNotImplementedComponent, type DefaultNotImplementedComponentProps, HeadingRichTextNode, LinkRichTextNode, ListItemRichTextNode, ListRichTextNode, ParagraphRichTextNode, type PersonalizeComponent, QuoteRichTextNode, type RenderRichTextComponentResolver, type ResolveRenderer, type RichTextComponentProps, type RichTextRendererComponent, RootRichTextNode, TableCellRichTextNode, TableRichTextNode, TableRowRichTextNode, type TestComponent, TextRichTextNode, UniformComponent, type UniformComponentProps, UniformComposition, type UniformCompositionProps, UniformPlayground, type UniformPlaygroundProps, UniformRichText, UniformRichTextNode, type UniformRichTextNodeProps, type UniformRichTextProps, UniformSlot, type UniformSlotProps, UniformText, type UniformTextProps, type UseUniformContextualEditingProps, convertComponentToProps, globalCompositionEnhancerInjectionKey, renderComponent, useUniformContextualEditing, useUniformCurrentComponent, useUniformCurrentComposition };
|
|
1091
|
+
export { type ComponentProps, DefaultNotImplementedComponent, type DefaultNotImplementedComponentProps, HeadingRichTextNode, LinkRichTextNode, ListItemRichTextNode, ListRichTextNode, ParagraphRichTextNode, type PersonalizeComponent, QuoteRichTextNode, type RenderRichTextComponentResolver, type ResolveRenderer, type RichTextComponentProps, type RichTextRendererComponent, RootRichTextNode, TableCellRichTextNode, TableRichTextNode, TableRowRichTextNode, type TestComponent, TextRichTextNode, UniformComponent, type UniformComponentProps, UniformComposition, type UniformCompositionProps, UniformPlayground, type UniformPlaygroundProps, UniformRichText, UniformRichTextNode, type UniformRichTextNodeProps, type UniformRichTextProps, UniformSlot, type UniformSlotProps, UniformText, type UniformTextProps, type UseUniformContextualEditingProps, type UseUniformContextualEditingStateProps, type UseUniformContextualEditingStateReturnType, convertComponentToProps, globalCompositionEnhancerInjectionKey, renderComponent, useUniformContextualEditing, useUniformContextualEditingState, useUniformCurrentComponent, useUniformCurrentComposition };
|
package/dist/index.esm.js
CHANGED
|
@@ -171,7 +171,8 @@ import {
|
|
|
171
171
|
IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID,
|
|
172
172
|
IN_CONTEXT_EDITOR_QUERY_STRING_PARAM,
|
|
173
173
|
isAllowedReferrer,
|
|
174
|
-
isUpdateCompositionInternalMessage
|
|
174
|
+
isUpdateCompositionInternalMessage,
|
|
175
|
+
version
|
|
175
176
|
} from "@uniformdev/canvas";
|
|
176
177
|
import { computed as computed2, onMounted, ref, watch } from "vue";
|
|
177
178
|
var registeredCompositionIds = /* @__PURE__ */ new Set();
|
|
@@ -244,7 +245,8 @@ var useUniformContextualEditing = ({
|
|
|
244
245
|
window.__UNIFORM_CONTEXTUAL_EDITING__ = {
|
|
245
246
|
framework: "Vue",
|
|
246
247
|
// Make sure to also update the value in canvas-react
|
|
247
|
-
version: 2
|
|
248
|
+
version: 2,
|
|
249
|
+
canvasPackageVersion: version
|
|
248
250
|
};
|
|
249
251
|
const script = document.createElement("script");
|
|
250
252
|
script.id = IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID;
|
|
@@ -972,6 +974,68 @@ var UniformText = defineComponent9({
|
|
|
972
974
|
}
|
|
973
975
|
});
|
|
974
976
|
|
|
977
|
+
// src/composables/useUniformContextualEditingState.ts
|
|
978
|
+
import {
|
|
979
|
+
createCanvasChannel as createCanvasChannel2,
|
|
980
|
+
isUpdateContextualEditingStateInternalMessage
|
|
981
|
+
} from "@uniformdev/canvas";
|
|
982
|
+
import { computed as computed7, ref as ref3, watch as watch2 } from "vue";
|
|
983
|
+
var useUniformContextualEditingState = ({
|
|
984
|
+
global: isGlobal = false
|
|
985
|
+
} = {}) => {
|
|
986
|
+
const { isContextualEditing } = useUniformCurrentComposition();
|
|
987
|
+
const { data: componentData } = useUniformCurrentComponent();
|
|
988
|
+
const selectedComponentReference = ref3();
|
|
989
|
+
const previewMode = ref3(
|
|
990
|
+
(isContextualEditing == null ? void 0 : isContextualEditing.value) ? "editor" : void 0
|
|
991
|
+
);
|
|
992
|
+
const channel = computed7(() => {
|
|
993
|
+
if (!(isContextualEditing == null ? void 0 : isContextualEditing.value) || typeof window === "undefined") {
|
|
994
|
+
return;
|
|
995
|
+
}
|
|
996
|
+
const channel2 = createCanvasChannel2({
|
|
997
|
+
broadcastTo: [window],
|
|
998
|
+
listenTo: [window]
|
|
999
|
+
});
|
|
1000
|
+
return channel2;
|
|
1001
|
+
});
|
|
1002
|
+
watch2(
|
|
1003
|
+
[() => isGlobal, () => componentData == null ? void 0 : componentData._id, channel],
|
|
1004
|
+
(_newValue, _oldValue, onCleanup) => {
|
|
1005
|
+
var _a, _b;
|
|
1006
|
+
if (!channel.value) {
|
|
1007
|
+
return;
|
|
1008
|
+
}
|
|
1009
|
+
if (typeof window !== "undefined") {
|
|
1010
|
+
previewMode.value = (_b = (_a = window.__UNIFORM_CONTEXTUAL_EDITING__) == null ? void 0 : _a.state) == null ? void 0 : _b.previewMode;
|
|
1011
|
+
}
|
|
1012
|
+
const unsubscribe = channel.value.on("update-contextual-editing-state-internal", async (message) => {
|
|
1013
|
+
var _a2;
|
|
1014
|
+
if (!isUpdateContextualEditingStateInternalMessage(message)) {
|
|
1015
|
+
return;
|
|
1016
|
+
}
|
|
1017
|
+
previewMode.value = message.state.previewMode;
|
|
1018
|
+
if (!global && (componentData == null ? void 0 : componentData._id) !== ((_a2 = message.state.selectedComponentReference) == null ? void 0 : _a2.parentId)) {
|
|
1019
|
+
selectedComponentReference.value = void 0;
|
|
1020
|
+
return;
|
|
1021
|
+
}
|
|
1022
|
+
selectedComponentReference.value = message.state.selectedComponentReference;
|
|
1023
|
+
});
|
|
1024
|
+
onCleanup(() => {
|
|
1025
|
+
unsubscribe();
|
|
1026
|
+
});
|
|
1027
|
+
},
|
|
1028
|
+
{
|
|
1029
|
+
immediate: true
|
|
1030
|
+
}
|
|
1031
|
+
);
|
|
1032
|
+
return {
|
|
1033
|
+
isContextualEditing,
|
|
1034
|
+
selectedComponentReference,
|
|
1035
|
+
previewMode
|
|
1036
|
+
};
|
|
1037
|
+
};
|
|
1038
|
+
|
|
975
1039
|
// src/helpers/getParameterAttributes.ts
|
|
976
1040
|
import { getParameterAttributes } from "@uniformdev/canvas";
|
|
977
1041
|
export {
|
|
@@ -1000,6 +1064,7 @@ export {
|
|
|
1000
1064
|
globalCompositionEnhancerInjectionKey,
|
|
1001
1065
|
renderComponent,
|
|
1002
1066
|
useUniformContextualEditing,
|
|
1067
|
+
useUniformContextualEditingState,
|
|
1003
1068
|
useUniformCurrentComponent,
|
|
1004
1069
|
useUniformCurrentComposition
|
|
1005
1070
|
};
|
package/dist/index.js
CHANGED
|
@@ -41,10 +41,11 @@ __export(src_exports, {
|
|
|
41
41
|
UniformText: () => UniformText,
|
|
42
42
|
convertComponentToProps: () => convertComponentToProps,
|
|
43
43
|
createUniformApiEnhancer: () => import_canvas3.createUniformApiEnhancer,
|
|
44
|
-
getParameterAttributes: () =>
|
|
44
|
+
getParameterAttributes: () => import_canvas10.getParameterAttributes,
|
|
45
45
|
globalCompositionEnhancerInjectionKey: () => globalCompositionEnhancerInjectionKey,
|
|
46
46
|
renderComponent: () => renderComponent,
|
|
47
47
|
useUniformContextualEditing: () => useUniformContextualEditing,
|
|
48
|
+
useUniformContextualEditingState: () => useUniformContextualEditingState,
|
|
48
49
|
useUniformCurrentComponent: () => useUniformCurrentComponent,
|
|
49
50
|
useUniformCurrentComposition: () => useUniformCurrentComposition
|
|
50
51
|
});
|
|
@@ -279,7 +280,8 @@ var useUniformContextualEditing = ({
|
|
|
279
280
|
window.__UNIFORM_CONTEXTUAL_EDITING__ = {
|
|
280
281
|
framework: "Vue",
|
|
281
282
|
// Make sure to also update the value in canvas-react
|
|
282
|
-
version: 2
|
|
283
|
+
version: 2,
|
|
284
|
+
canvasPackageVersion: import_canvas3.version
|
|
283
285
|
};
|
|
284
286
|
const script = document.createElement("script");
|
|
285
287
|
script.id = import_canvas3.IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID;
|
|
@@ -966,7 +968,7 @@ var UniformText = (0, import_vue24.defineComponent)({
|
|
|
966
968
|
return (0, import_vue24.h)(
|
|
967
969
|
(_a2 = props.as) != null ? _a2 : DEFAULT_ELEMENT_TYPE,
|
|
968
970
|
{
|
|
969
|
-
...(0,
|
|
971
|
+
...(0, import_canvas10.getParameterAttributes)({
|
|
970
972
|
component: componentData,
|
|
971
973
|
id: props.parameterId,
|
|
972
974
|
isMultiline: props.isMultiline
|
|
@@ -984,8 +986,67 @@ var UniformText = (0, import_vue24.defineComponent)({
|
|
|
984
986
|
}
|
|
985
987
|
});
|
|
986
988
|
|
|
987
|
-
// src/
|
|
989
|
+
// src/composables/useUniformContextualEditingState.ts
|
|
988
990
|
var import_canvas9 = require("@uniformdev/canvas");
|
|
991
|
+
var import_vue25 = require("vue");
|
|
992
|
+
var useUniformContextualEditingState = ({
|
|
993
|
+
global: isGlobal = false
|
|
994
|
+
} = {}) => {
|
|
995
|
+
const { isContextualEditing } = useUniformCurrentComposition();
|
|
996
|
+
const { data: componentData } = useUniformCurrentComponent();
|
|
997
|
+
const selectedComponentReference = (0, import_vue25.ref)();
|
|
998
|
+
const previewMode = (0, import_vue25.ref)(
|
|
999
|
+
(isContextualEditing == null ? void 0 : isContextualEditing.value) ? "editor" : void 0
|
|
1000
|
+
);
|
|
1001
|
+
const channel = (0, import_vue25.computed)(() => {
|
|
1002
|
+
if (!(isContextualEditing == null ? void 0 : isContextualEditing.value) || typeof window === "undefined") {
|
|
1003
|
+
return;
|
|
1004
|
+
}
|
|
1005
|
+
const channel2 = (0, import_canvas9.createCanvasChannel)({
|
|
1006
|
+
broadcastTo: [window],
|
|
1007
|
+
listenTo: [window]
|
|
1008
|
+
});
|
|
1009
|
+
return channel2;
|
|
1010
|
+
});
|
|
1011
|
+
(0, import_vue25.watch)(
|
|
1012
|
+
[() => isGlobal, () => componentData == null ? void 0 : componentData._id, channel],
|
|
1013
|
+
(_newValue, _oldValue, onCleanup) => {
|
|
1014
|
+
var _a, _b;
|
|
1015
|
+
if (!channel.value) {
|
|
1016
|
+
return;
|
|
1017
|
+
}
|
|
1018
|
+
if (typeof window !== "undefined") {
|
|
1019
|
+
previewMode.value = (_b = (_a = window.__UNIFORM_CONTEXTUAL_EDITING__) == null ? void 0 : _a.state) == null ? void 0 : _b.previewMode;
|
|
1020
|
+
}
|
|
1021
|
+
const unsubscribe = channel.value.on("update-contextual-editing-state-internal", async (message) => {
|
|
1022
|
+
var _a2;
|
|
1023
|
+
if (!(0, import_canvas9.isUpdateContextualEditingStateInternalMessage)(message)) {
|
|
1024
|
+
return;
|
|
1025
|
+
}
|
|
1026
|
+
previewMode.value = message.state.previewMode;
|
|
1027
|
+
if (!global && (componentData == null ? void 0 : componentData._id) !== ((_a2 = message.state.selectedComponentReference) == null ? void 0 : _a2.parentId)) {
|
|
1028
|
+
selectedComponentReference.value = void 0;
|
|
1029
|
+
return;
|
|
1030
|
+
}
|
|
1031
|
+
selectedComponentReference.value = message.state.selectedComponentReference;
|
|
1032
|
+
});
|
|
1033
|
+
onCleanup(() => {
|
|
1034
|
+
unsubscribe();
|
|
1035
|
+
});
|
|
1036
|
+
},
|
|
1037
|
+
{
|
|
1038
|
+
immediate: true
|
|
1039
|
+
}
|
|
1040
|
+
);
|
|
1041
|
+
return {
|
|
1042
|
+
isContextualEditing,
|
|
1043
|
+
selectedComponentReference,
|
|
1044
|
+
previewMode
|
|
1045
|
+
};
|
|
1046
|
+
};
|
|
1047
|
+
|
|
1048
|
+
// src/helpers/getParameterAttributes.ts
|
|
1049
|
+
var import_canvas10 = require("@uniformdev/canvas");
|
|
989
1050
|
// Annotate the CommonJS export names for ESM import in node:
|
|
990
1051
|
0 && (module.exports = {
|
|
991
1052
|
DefaultNotImplementedComponent,
|
|
@@ -1013,6 +1074,7 @@ var import_canvas9 = require("@uniformdev/canvas");
|
|
|
1013
1074
|
globalCompositionEnhancerInjectionKey,
|
|
1014
1075
|
renderComponent,
|
|
1015
1076
|
useUniformContextualEditing,
|
|
1077
|
+
useUniformContextualEditingState,
|
|
1016
1078
|
useUniformCurrentComponent,
|
|
1017
1079
|
useUniformCurrentComposition
|
|
1018
1080
|
});
|
package/dist/index.mjs
CHANGED
|
@@ -171,7 +171,8 @@ import {
|
|
|
171
171
|
IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID,
|
|
172
172
|
IN_CONTEXT_EDITOR_QUERY_STRING_PARAM,
|
|
173
173
|
isAllowedReferrer,
|
|
174
|
-
isUpdateCompositionInternalMessage
|
|
174
|
+
isUpdateCompositionInternalMessage,
|
|
175
|
+
version
|
|
175
176
|
} from "@uniformdev/canvas";
|
|
176
177
|
import { computed as computed2, onMounted, ref, watch } from "vue";
|
|
177
178
|
var registeredCompositionIds = /* @__PURE__ */ new Set();
|
|
@@ -244,7 +245,8 @@ var useUniformContextualEditing = ({
|
|
|
244
245
|
window.__UNIFORM_CONTEXTUAL_EDITING__ = {
|
|
245
246
|
framework: "Vue",
|
|
246
247
|
// Make sure to also update the value in canvas-react
|
|
247
|
-
version: 2
|
|
248
|
+
version: 2,
|
|
249
|
+
canvasPackageVersion: version
|
|
248
250
|
};
|
|
249
251
|
const script = document.createElement("script");
|
|
250
252
|
script.id = IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID;
|
|
@@ -972,6 +974,68 @@ var UniformText = defineComponent9({
|
|
|
972
974
|
}
|
|
973
975
|
});
|
|
974
976
|
|
|
977
|
+
// src/composables/useUniformContextualEditingState.ts
|
|
978
|
+
import {
|
|
979
|
+
createCanvasChannel as createCanvasChannel2,
|
|
980
|
+
isUpdateContextualEditingStateInternalMessage
|
|
981
|
+
} from "@uniformdev/canvas";
|
|
982
|
+
import { computed as computed7, ref as ref3, watch as watch2 } from "vue";
|
|
983
|
+
var useUniformContextualEditingState = ({
|
|
984
|
+
global: isGlobal = false
|
|
985
|
+
} = {}) => {
|
|
986
|
+
const { isContextualEditing } = useUniformCurrentComposition();
|
|
987
|
+
const { data: componentData } = useUniformCurrentComponent();
|
|
988
|
+
const selectedComponentReference = ref3();
|
|
989
|
+
const previewMode = ref3(
|
|
990
|
+
(isContextualEditing == null ? void 0 : isContextualEditing.value) ? "editor" : void 0
|
|
991
|
+
);
|
|
992
|
+
const channel = computed7(() => {
|
|
993
|
+
if (!(isContextualEditing == null ? void 0 : isContextualEditing.value) || typeof window === "undefined") {
|
|
994
|
+
return;
|
|
995
|
+
}
|
|
996
|
+
const channel2 = createCanvasChannel2({
|
|
997
|
+
broadcastTo: [window],
|
|
998
|
+
listenTo: [window]
|
|
999
|
+
});
|
|
1000
|
+
return channel2;
|
|
1001
|
+
});
|
|
1002
|
+
watch2(
|
|
1003
|
+
[() => isGlobal, () => componentData == null ? void 0 : componentData._id, channel],
|
|
1004
|
+
(_newValue, _oldValue, onCleanup) => {
|
|
1005
|
+
var _a, _b;
|
|
1006
|
+
if (!channel.value) {
|
|
1007
|
+
return;
|
|
1008
|
+
}
|
|
1009
|
+
if (typeof window !== "undefined") {
|
|
1010
|
+
previewMode.value = (_b = (_a = window.__UNIFORM_CONTEXTUAL_EDITING__) == null ? void 0 : _a.state) == null ? void 0 : _b.previewMode;
|
|
1011
|
+
}
|
|
1012
|
+
const unsubscribe = channel.value.on("update-contextual-editing-state-internal", async (message) => {
|
|
1013
|
+
var _a2;
|
|
1014
|
+
if (!isUpdateContextualEditingStateInternalMessage(message)) {
|
|
1015
|
+
return;
|
|
1016
|
+
}
|
|
1017
|
+
previewMode.value = message.state.previewMode;
|
|
1018
|
+
if (!global && (componentData == null ? void 0 : componentData._id) !== ((_a2 = message.state.selectedComponentReference) == null ? void 0 : _a2.parentId)) {
|
|
1019
|
+
selectedComponentReference.value = void 0;
|
|
1020
|
+
return;
|
|
1021
|
+
}
|
|
1022
|
+
selectedComponentReference.value = message.state.selectedComponentReference;
|
|
1023
|
+
});
|
|
1024
|
+
onCleanup(() => {
|
|
1025
|
+
unsubscribe();
|
|
1026
|
+
});
|
|
1027
|
+
},
|
|
1028
|
+
{
|
|
1029
|
+
immediate: true
|
|
1030
|
+
}
|
|
1031
|
+
);
|
|
1032
|
+
return {
|
|
1033
|
+
isContextualEditing,
|
|
1034
|
+
selectedComponentReference,
|
|
1035
|
+
previewMode
|
|
1036
|
+
};
|
|
1037
|
+
};
|
|
1038
|
+
|
|
975
1039
|
// src/helpers/getParameterAttributes.ts
|
|
976
1040
|
import { getParameterAttributes } from "@uniformdev/canvas";
|
|
977
1041
|
export {
|
|
@@ -1000,6 +1064,7 @@ export {
|
|
|
1000
1064
|
globalCompositionEnhancerInjectionKey,
|
|
1001
1065
|
renderComponent,
|
|
1002
1066
|
useUniformContextualEditing,
|
|
1067
|
+
useUniformContextualEditingState,
|
|
1003
1068
|
useUniformCurrentComponent,
|
|
1004
1069
|
useUniformCurrentComposition
|
|
1005
1070
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uniformdev/canvas-vue",
|
|
3
|
-
"version": "20.
|
|
3
|
+
"version": "20.7.1-alpha.102+d621aa22b2",
|
|
4
4
|
"description": "Vue SDK for Uniform Canvas",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -27,12 +27,12 @@
|
|
|
27
27
|
"test": "jest --maxWorkers=1 --passWithNoTests",
|
|
28
28
|
"lint": "eslint \"src/**/*.{js,ts,tsx}\"",
|
|
29
29
|
"format": "prettier --write \"src/**/*.{js,ts,tsx}\"",
|
|
30
|
-
"document": "api-extractor run --local"
|
|
30
|
+
"document:prebuild": "api-extractor run --local"
|
|
31
31
|
},
|
|
32
32
|
"dependencies": {
|
|
33
|
-
"@uniformdev/canvas": "20.
|
|
34
|
-
"@uniformdev/context-vue": "20.
|
|
35
|
-
"@uniformdev/richtext": "20.
|
|
33
|
+
"@uniformdev/canvas": "20.7.1-alpha.102+d621aa22b2",
|
|
34
|
+
"@uniformdev/context-vue": "20.7.1-alpha.102+d621aa22b2",
|
|
35
|
+
"@uniformdev/richtext": "20.7.1-alpha.102+d621aa22b2"
|
|
36
36
|
},
|
|
37
37
|
"peerDependencies": {
|
|
38
38
|
"vue": ">=3.0.0"
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"@vue/server-test-utils": "1.3.0",
|
|
49
49
|
"@vue/test-utils": "2.4.6",
|
|
50
50
|
"@vue/vue3-jest": "^29.2.6",
|
|
51
|
-
"vue": "3.5.
|
|
51
|
+
"vue": "3.5.21",
|
|
52
52
|
"vue-server-renderer": "2.7.16",
|
|
53
53
|
"vue-template-compiler": "2.7.16"
|
|
54
54
|
},
|
|
@@ -64,5 +64,5 @@
|
|
|
64
64
|
"publishConfig": {
|
|
65
65
|
"access": "public"
|
|
66
66
|
},
|
|
67
|
-
"gitHead": "
|
|
67
|
+
"gitHead": "d621aa22b220347565e307b064fb1eda8963abbe"
|
|
68
68
|
}
|