@uniformdev/canvas-vue 14.2.1-alpha.256 → 16.0.1-alpha.143

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 (6) hide show
  1. package/LICENSE.txt +2 -2
  2. package/dist/index.d.ts +52 -75
  3. package/dist/index.esm.js +1 -1
  4. package/dist/index.js +1 -1
  5. package/dist/index.mjs +1 -1
  6. package/package.json +16 -11
package/LICENSE.txt CHANGED
@@ -1,2 +1,2 @@
1
- © 2021 Uniform Systems, Inc. All Rights Reserved.
2
- See details of Uniform Systems, Inc. Master Subscription Agreement here: https://uniform.dev/eula
1
+ © 2022 Uniform Systems, Inc. All Rights Reserved.
2
+ See details of Uniform Systems, Inc. Master Subscription Agreement here: https://uniform.dev/eula
package/dist/index.d.ts CHANGED
@@ -1,51 +1,27 @@
1
- import Vue, { Component } from 'vue';
2
- import { ThisTypedComponentOptionsWithRecordProps, DefaultData, DefaultMethods, DefaultComputed } from 'vue/types/options';
3
- import { ComponentInstance, ComponentParameter } from '@uniformdev/canvas';
4
- import { ListPersonalizerArguments } from '@uniformdev/optimize-tracker-common';
1
+ import { resolveComponent, Component, Ref } from 'vue-demi';
2
+ import { ComponentInstance, ComponentParameter, SubscribeToCompositionOptions } from '@uniformdev/canvas';
5
3
 
6
- declare type PageMetaProps = {
7
- id: string;
8
- name: string;
9
- slug: string;
10
- };
11
4
  declare type CompositionProps = {
5
+ /** A dynamic vue component that provides data to the Uniform Canvas SlotContent component via provide/inject */
12
6
  composition: ComponentInstance;
13
- pageMeta?: PageMetaProps;
14
- wrapper?: string | Component;
7
+ resolveRenderer?: typeof resolveComponent;
8
+ behaviorTracking?: 'onLoad' | 'onView';
15
9
  };
16
- declare type CompositionState = DefaultData<Vue>;
17
- declare type Methods$2 = DefaultMethods<Vue>;
18
- declare type Computed$2 = {
19
- slots: Record<string, unknown> | Record<string, never>;
20
- pageMetaData: {
21
- id?: string | undefined;
22
- name?: string | undefined;
23
- slug?: string | undefined;
24
- } | Record<string, never> | undefined;
25
- parameters: Record<string, unknown> | Record<string, never>;
26
- componentKey: string;
10
+ declare const Composition: Component;
11
+
12
+ declare type SlotComponentProps = {
13
+ slotName?: string;
27
14
  };
28
- declare type VueSetupProps$2 = ThisTypedComponentOptionsWithRecordProps<Vue, CompositionState, Methods$2, Computed$2, CompositionProps>;
29
15
  /**
30
- * Generates a Composition Vue Component
31
- * @vue-prop {Object} composition - A dynamic vue component that provides data to the Uniform Canvas SlotContent component via provide/inject
32
- * @vue-prop {Object} pageMeta - Page meta data that takes and ID, name and slug as an object
33
- * @vue-prop {String | Object} wrapper - defaults to 'div' but can be passed a HTML tag as string or a Vue component
34
- * @vue-computed {Object} slots - returns Uniform Canvas slot data
35
- * @vue-computed {Object | undefined} pageMetaData - returns undefined or an object of keys / values (id, name, slug)
36
- * @vue-computed {Object} parameters - returns and empty object or a object of parameters
37
- * @vue-computed {String} componentKey - returns a generated unique key value
16
+ * Generates a SlotContent Vue Component
17
+ * @vue-prop {String} slotName - name of the Uniform Canvas slot you wish to scope to
38
18
  */
39
- declare const Composition: VueSetupProps$2;
19
+ declare const SlotContent: Component;
40
20
 
41
- declare type DefaultNotImplementedComponentProps<TProps = unknown> = TProps & {
21
+ declare type DefaultNotImplementedComponentProps = {
42
22
  component: ComponentInstance;
43
23
  };
44
- declare type VueSetupProps$1 = ThisTypedComponentOptionsWithRecordProps<Vue, DefaultNotImplementedComponentState, Methods$1, Computed$1, DefaultNotImplementedComponentProps>;
45
- declare type DefaultNotImplementedComponentState = DefaultData<Vue>;
46
- declare type Methods$1 = DefaultMethods<Vue>;
47
- declare type Computed$1 = DefaultComputed;
48
- declare const DefaultNotImplementedComponent: VueSetupProps$1;
24
+ declare const DefaultNotImplementedComponent: Component;
49
25
 
50
26
  declare type MapComponentNameProps = {
51
27
  name: string;
@@ -53,46 +29,31 @@ declare type MapComponentNameProps = {
53
29
  };
54
30
  declare type SlotDataProps = Record<string, any>;
55
31
  declare type MapSlotDataResolve = Array<MapComponentNameProps>;
56
- declare type PersonalizeComponetProps = {
57
- uniformData: {
58
- parameters?: {
59
- trackingEventName?: ComponentParameter<string>;
60
- count?: ComponentParameter<string | number>;
61
- matchFilter?: ComponentParameter<ListPersonalizerArguments<any>['matchFilter']>;
62
- };
63
- slots?: Record<string, ComponentInstance[]>;
32
+ interface TestComponent {
33
+ slots?: {
34
+ test?: ComponentInstance[];
64
35
  };
65
- };
66
- declare type TestComponentProps = {
67
- uniformData: {
68
- slots?: {
69
- test?: ComponentInstance[];
70
- };
71
- parameters?: {
72
- test?: ComponentParameter<string | undefined>;
73
- };
36
+ parameters: {
37
+ test?: ComponentParameter<string | undefined>;
74
38
  };
75
- };
76
-
77
- declare type SlotComponentProps = {
78
- uniformData?: Record<string, unknown>;
79
- slotName?: string;
80
- wrapper?: string | Component;
81
- };
82
- declare type SlotComponentState = DefaultData<Vue>;
83
- declare type Methods = DefaultMethods<Vue>;
84
- declare type Computed = {
85
- slotItems: Array<MapComponentNameProps>;
86
- };
39
+ }
40
+ interface PersonalizeComponent {
41
+ slots?: {
42
+ pz?: ComponentInstance[];
43
+ };
44
+ parameters: {
45
+ trackingEventName?: ComponentParameter<string>;
46
+ count?: ComponentParameter<string | number>;
47
+ };
48
+ }
87
49
  /**
88
- * Generates a SlotContent Vue Component
89
- * @vue-prop {Object} uniformData - Optional prop
90
- * @vue-prop {String} slotName - name of the Uniform Canvas slot you wish to scope to
91
- * @vue-prop {String | Object} wrapper - defaults to 'div' but can be passed a HTML tag as string or a Vue component
92
- * @vue-computed {Array} slotItems - returns an array of objects with keys "name: String, components: Array<>"
50
+ * Props passed to a Canvas component implementation.
51
+ * TProps is the Canvas component's parameters object after
52
+ * all enhancers have been applied.
93
53
  */
94
- declare type VueSetupProps = ThisTypedComponentOptionsWithRecordProps<Vue, SlotComponentState, Methods, Computed, SlotComponentProps>;
95
- declare const SlotContent: VueSetupProps;
54
+ declare type ComponentProps<TProps = unknown> = TProps & {
55
+ component: ComponentInstance;
56
+ };
96
57
 
97
58
  /**
98
59
  * Finds the data for the provide slot name
@@ -125,9 +86,25 @@ declare const mapTestSlotToVariants: (slotData: MapComponentNameProps) => {
125
86
  component: string;
126
87
  }[];
127
88
 
89
+ /**
90
+ * Converts a raw Canvas component instance to React component props format.
91
+ * This merges each parameter moved to the root object and removes the 'value' node,
92
+ * hugely simplifying rendering code. For example if the raw object has parameters.foo.value,
93
+ * then the final props have props.foo === raw.parameters.foo.value.
94
+ */
95
+ declare function convertComponentToProps<T = unknown>(component: ComponentInstance): ComponentProps<T>;
96
+
97
+ declare type UseCompositionEventEffectOptions = Omit<Partial<SubscribeToCompositionOptions>, 'callback' | 'compositionId'> & {
98
+ compositionIdRef: Ref<SubscribeToCompositionOptions['compositionId']>;
99
+ enabled: boolean;
100
+ effect: () => void;
101
+ };
102
+ /** A composable to manage a subscription to a realtime event on a composition */
103
+ declare function useCompositionEventEffect({ enabled, projectId, compositionIdRef, effect, }: UseCompositionEventEffectOptions): Promise<void>;
104
+
128
105
  /** Public ID of Canvas composition component type */
129
106
  declare const CANVAS_COMPOSITION_TYPE = "Composition";
130
107
  /** Public ID of Canvas slot component component type */
131
108
  declare const CANVAS_SLOT_CONTENT_TYPE = "SlotContent";
132
109
 
133
- export { CANVAS_COMPOSITION_TYPE, CANVAS_SLOT_CONTENT_TYPE, Composition, DefaultNotImplementedComponent, MapComponentNameProps, MapSlotDataResolve, PersonalizeComponetProps, SlotComponentProps, SlotContent, SlotDataProps, TestComponentProps, getDataForSlot, mapPzSlotToVariants, mapSlotsData, mapTestSlotToVariants };
110
+ export { CANVAS_COMPOSITION_TYPE, CANVAS_SLOT_CONTENT_TYPE, ComponentProps, Composition, CompositionProps, DefaultNotImplementedComponent, DefaultNotImplementedComponentProps, MapComponentNameProps, MapSlotDataResolve, PersonalizeComponent, SlotComponentProps, SlotContent, SlotDataProps, TestComponent, UseCompositionEventEffectOptions, convertComponentToProps, getDataForSlot, mapPzSlotToVariants, mapSlotsData, mapTestSlotToVariants, useCompositionEventEffect };
package/dist/index.esm.js CHANGED
@@ -1 +1 @@
1
- import{v4 as I}from"uuid";var S="Composition",D="SlotContent";var g={watch:{"$route.query"(){this.reevaluateSignals()}},mounted(){this.$nextTick(()=>{this.reevaluateSignals()})},methods:{reevaluateSignals(){this.$uniformOptimizeContext&&(this.$uniformOptimizeContext.trackerInitializing||this.$uniformOptimizeContext.tracker.reevaluateSignals())}}};var k={name:S,inheritAttrs:!1,props:{composition:{type:Object,required:!0},pageMeta:{type:Object},wrapper:{type:[String,Object],default:"div"}},mixins:[g],provide(){var t;return{$__uniformData__:(t=this.$props.composition)==null?void 0:t.slots}},computed:{slots(){return!this.$props.composition||!this.$props.composition.slots?{}:this.$props.composition.slots},pageMetaData(){var t,o,e;if(!!this.$props.pageMeta)return Object.keys(this.$props.pageMeta).length?{id:(t=this.$props.pageMeta)==null?void 0:t.id,name:(o=this.$props.pageMeta)==null?void 0:o.name,slug:(e=this.$props.pageMeta)==null?void 0:e.slug}:{}},parameters(){var t;return!this.$props.composition||!((t=this.$props.composition)!=null&&t.parameters)?{}:this.$props.composition.parameters},componentKey(){return`uniform-composition-${I()}`}},render(t){return Object.keys(this.slots).length&&this.$scopedSlots.default?t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$scopedSlots.default({slots:this.slots,parameters:this.parameters})):Object.keys(this.slots).length===0&&this.$scopedSlots.default?t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$scopedSlots.default({slots:this.slots,parameters:this.parameters})):t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$slots.default)}};var _={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},v={margin:"0 0 1rem"},E={name:"default-not-implemented-component",inheritAttrs:!1,props:{component:{type:Object,required:!0}},render(t){var e;let o=(e=this.component)==null?void 0:e.type;return t("div",{key:"content",style:{..._}},[t("h2",{style:{...v}},`Component: ${o}`),t("p",[t("strong",`${o} has no Vue implementation. It may need to be added to your `),t("code",{},"resolveRenderer() function.")]),t("details",{},[t("summary",{},"props"),t("pre",{style:{overflowX:"auto"}},`${JSON.stringify(this.$props)}`)])])}};import{pascalCase as N}from"pascal-case";import{CANVAS_PERSONALIZE_TYPE as x,CANVAS_TEST_TYPE as M,mapSlotToPersonalizedVariations as w}from"@uniformdev/canvas";import{Personalize as R,Test as b}from"@uniformdev/optimize-tracker-vue";import{pascalCase as $}from"pascal-case";var T=(t,o)=>t.find(e=>e.name===o),C=t=>{let o=[];for(let e in t)o.push({name:e,components:t[e]});return o},J=t=>{let o=e=>(delete e.parameters.intentTag,e);return t.components.map(e=>{var r;return{component:$(e.type),intentTag:((r=e.parameters.intentTag)==null?void 0:r.value)||{intents:{}},...o(e)}})},X=t=>{let o=e=>e;return t.components.map(e=>({component:$(e.type),...o(e)}))};var A={name:D,inheritAttrs:!1,props:{uniformData:{type:Object},slotName:{type:String,required:!0},wrapper:{type:[String,Object],default:"div"}},inject:["$__uniformData__"],computed:{slotItems(){return this.uniformData?C(this.uniformData):C(this.$__uniformData__)}},render(t){if(this.slotItems){if(this.slotName){let o=T(this.slotItems,this.slotName),e=o==null?void 0:o.components.map((r,p)=>{let n={uniformData:r};if(r.type===M)return O(t,n,`${r.type}-${p}`);if(r.type===x)return V(t,n,`${r.type}-${p}`);let s=N(r.type);return t(s,{props:n,attrs:{...this.$attrs},key:`${s}-${p}`})});return t(this.wrapper,{key:this.slotName,props:{...this.$props},attrs:{...this.$attrs}},e)}if(!this.slotName){let o=this.slotItems.map((e,r)=>{let p=e==null?void 0:e.components.map((n,s)=>{let i={uniformData:n};if(n.type===M)return O(t,i,`${n.type}-${s}`);if(n.type===x)return V(t,i,`${n.type}-${s}`);let m=N(n.type);return t(m,{props:i,attrs:{...this.$attrs},key:`${m}-${s}`})});return t(this.wrapper,{key:`${e.name}-${r}`},p)});return t(this.wrapper,{key:"slot-content",props:{...this.$props},attrs:{...this.$attrs}},o)}}return t(this.wrapper,{key:"slot-content",props:{...this.$props},attrs:{...this.$attrs}},this.$slots.default)}};function z(t){if(typeof(t==null?void 0:t.value)=="string")return t.value}function V(t,o,e){var s,i,m,d,c;let r=o.uniformData,p=r==null?void 0:r.parameters,n=w((s=r==null?void 0:r.slots)==null?void 0:s.pz);return t(R,{props:{variations:n,count:Number((m=(i=p==null?void 0:p.count)==null?void 0:i.value)!=null?m:1),trackingEventName:(d=p==null?void 0:p.trackingEventName)==null?void 0:d.value,matchFilter:(c=p==null?void 0:p.matchFilter)==null?void 0:c.value},key:e,scopedSlots:{default:f=>f.variations.map((a,y)=>t(a.type,{props:{uniformData:a},key:`${a.type}-${y}`}))}})}function O(t,o,e){var s,i,m,d,c,f;let r=(m=(i=(s=o.uniformData)==null?void 0:s.slots)==null?void 0:i.test)!=null?m:[],p=((f=(c=(d=o.uniformData)==null?void 0:d.parameters)==null?void 0:c.test)==null?void 0:f.value)||"Untitled Test",n=r.map((a,y)=>{var h,P;return{...a,id:(P=z((h=a.parameters)==null?void 0:h.testId))!=null?P:`variation-${y+1}-${a.type}`}});return t(b,{props:{variations:n,name:p},key:e,scopedSlots:{default:({variant:a})=>t(a.type,{key:`${a.type}-${e}`,props:{uniformData:a}})}})}export{S as CANVAS_COMPOSITION_TYPE,D as CANVAS_SLOT_CONTENT_TYPE,k as Composition,E as DefaultNotImplementedComponent,A as SlotContent,T as getDataForSlot,J as mapPzSlotToVariants,C as mapSlotsData,X as mapTestSlotToVariants};
1
+ "use strict";import{defineComponent as h,computed as P,h as k,provide as g,resolveComponent as V}from"vue-demi";var N="Composition",_="SlotContent";import{CANVAS_ENRICHMENT_TAG_PARAM as $}from"@uniformdev/canvas";import{Track as M,TrackSlot as z,useUniformContext as U}from"@uniformdev/context-vue";var y=h({name:N,inheritAttrs:!1,props:{composition:{type:Object,required:!0},resolveRenderer:{type:Function,default:V},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var m,u;let o=P(()=>e.composition);g("$__uniformData__",o),g("$__uniformResolveRenderer__",e.resolveRenderer);let n=P(()=>{var p,i;return(i=(p=o.value)==null?void 0:p.slots)!=null?i:{}}),c=P(()=>{var p,i;return(i=(p=o.value)==null?void 0:p.parameters)!=null?i:{}}),r=P(()=>{var p,i,v,S;return JSON.stringify((S=(v=(i=(p=o.value.slots)==null?void 0:p.content)==null?void 0:i[0].parameters)==null?void 0:v.title)==null?void 0:S.value)}),s=U()!==void 0,a=(u=(m=o.value.parameters)==null?void 0:m[$])==null?void 0:u.value,C=e.behaviorTracking==="onLoad"?z:M,l=()=>{var p,i;return(i=(p=t.slots).default)==null?void 0:i.call(p,{slots:n.value,parameters:c.value})};return s?()=>k(C,{behavior:a,key:r.value},l):l}});import{defineComponent as L,computed as Y,h as f,inject as A}from"vue-demi";import{CANVAS_PERSONALIZE_TYPE as E,CANVAS_TEST_TYPE as I,mapSlotToPersonalizedVariations as j}from"@uniformdev/canvas";import{Personalize as F,Test as q}from"@uniformdev/context-vue";import{pascalCase as b}from"pascal-case";var R=(e,t)=>e.find(o=>o.name===t),x=e=>{let t=[];for(let o in e)t.push({name:o,components:e[o]});return t},se=e=>{let t=o=>(delete o.parameters.intentTag,o);return e.components.map(o=>{var n;return{component:b(o.type),intentTag:((n=o.parameters.intentTag)==null?void 0:n.value)||{intents:{}},...t(o)}})},ae=e=>{let t=o=>o;return e.components.map(o=>({component:b(o.type),...t(o)}))};function T(e){var c;let t=(c=e.parameters)!=null?c:{};return{...Object.entries(t).reduce((r,[s,{value:a}])=>({...r,[w(s)]:a}),{}),...e.data,component:e}}function w(e){return e.replace("$","")}function B(e){if(typeof(e==null?void 0:e.value)=="string")return e.value}function D(e,t,o){var r,s,a;let n=e==null?void 0:e.parameters,c=j((r=e.slots)==null?void 0:r.pz);return f(F,{name:o,component:C=>{let l=T(C),m=()=>f(t(C.type),l);return f(y,{composition:l.component},m)},variations:c,count:Number((a=(s=n==null?void 0:n.count)==null?void 0:s.value)!=null?a:1),key:o})}function O(e,t,o){var s,a,C,l;let n=(a=(s=e==null?void 0:e.slots)==null?void 0:s.test)!=null?a:[],c=((l=(C=e==null?void 0:e.parameters)==null?void 0:C.test)==null?void 0:l.value)||"Untitled Test",r=n.map((m,u)=>{var p,i;return{...m,id:(i=B((p=m.parameters)==null?void 0:p.testId))!=null?i:`variation-${u+1}-${m.type}`}});return f(q,{variations:r,name:c,key:o,component:m=>{let u=T(m),p=()=>f(t(m.type),u);return f(y,{composition:u.component},p)}})}var Pe=L({name:_,inheritAttrs:!1,props:{slotName:{type:String,required:!0}},setup(e,t){let o=A("$__uniformData__"),n=A("$__uniformResolveRenderer__"),c=Y(()=>{var r;return x((r=o.value.slots)!=null?r:{})});if(e.slotName){let r=R(c.value,e.slotName);return()=>{var s;return(s=r==null?void 0:r.components.map((a,C)=>{let l=T(a),m=a.type,u=`${m}-${C}`,p=n(m),i=()=>f(p,{...l,...t.attrs,key:u});return a.type===I&&(i=()=>O(a,n,u)),a.type===E&&(i=()=>D(a,n,u)),f(y,{composition:l.component},i)}))!=null?s:[]}}return()=>c.value.map(r=>r==null?void 0:r.components.map((s,a)=>{let C=T(s),l=s.type,m=`${l}-${a}`,u=n(l),p=()=>f(u,{...C,...t.attrs,key:m});return s.type===I&&(p=()=>O(s,n,m)),s.type===E&&(p=()=>D(s,n,m)),f(y,{composition:C.component},p)}))}});import{defineComponent as J,h as d}from"vue-demi";var G={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},H={margin:"0 0 1rem"},_e=J({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(e,{attrs:t}){var n;let o=(n=e.component)==null?void 0:n.type;return()=>d("div",{key:"content",style:{...G}},[d("h2",{style:{...H}},`Component: ${o}`),d("p",[d("strong",`${o} has no Vue implementation. It may need to be added to your `),d("code",{},"resolveRenderer()"),d("strong",{}," function.")]),d("details",{},[d("summary",{},"props/attributes"),d("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});import{CANVAS_DRAFT_STATE as X,createEventBus as Z,subscribeToComposition as K}from"@uniformdev/canvas";import{watch as Q}from"vue-demi";async function xe({enabled:e,projectId:t,compositionIdRef:o,effect:n}){let c;Q([()=>e,()=>o.value,()=>t],async()=>{if(c==null||c(),!e||!o.value||!t)return;let r=await Z();r&&(c=K({eventBus:r,compositionId:o.value,compositionState:X,projectId:t,callback:n,event:"updated"}))},{immediate:!0})}export{N as CANVAS_COMPOSITION_TYPE,_ as CANVAS_SLOT_CONTENT_TYPE,y as Composition,_e as DefaultNotImplementedComponent,Pe as SlotContent,T as convertComponentToProps,R as getDataForSlot,se as mapPzSlotToVariants,x as mapSlotsData,ae as mapTestSlotToVariants,xe as useCompositionEventEffect};
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- var P=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var b=t=>P(t,"__esModule",{value:!0});var A=(t,o)=>{for(var e in o)P(t,e,{get:o[e],enumerable:!0})},z=(t,o,e,r)=>{if(o&&typeof o=="object"||typeof o=="function")for(let p of w(o))!R.call(t,p)&&(e||p!=="default")&&P(t,p,{get:()=>o[p],enumerable:!(r=E(o,p))||r.enumerable});return t};var j=(t=>(o,e)=>t&&t.get(o)||(e=z(b({}),o,1),t&&t.set(o,e),e))(typeof WeakMap!="undefined"?new WeakMap:0);var K={};A(K,{CANVAS_COMPOSITION_TYPE:()=>S,CANVAS_SLOT_CONTENT_TYPE:()=>D,Composition:()=>O,DefaultNotImplementedComponent:()=>I,SlotContent:()=>v,getDataForSlot:()=>$,mapPzSlotToVariants:()=>L,mapSlotsData:()=>y,mapTestSlotToVariants:()=>q});var V=require("uuid");var S="Composition",D="SlotContent";var M={watch:{"$route.query"(){this.reevaluateSignals()}},mounted(){this.$nextTick(()=>{this.reevaluateSignals()})},methods:{reevaluateSignals(){this.$uniformOptimizeContext&&(this.$uniformOptimizeContext.trackerInitializing||this.$uniformOptimizeContext.tracker.reevaluateSignals())}}};var O={name:S,inheritAttrs:!1,props:{composition:{type:Object,required:!0},pageMeta:{type:Object},wrapper:{type:[String,Object],default:"div"}},mixins:[M],provide(){var t;return{$__uniformData__:(t=this.$props.composition)==null?void 0:t.slots}},computed:{slots(){return!this.$props.composition||!this.$props.composition.slots?{}:this.$props.composition.slots},pageMetaData(){var t,o,e;if(!!this.$props.pageMeta)return Object.keys(this.$props.pageMeta).length?{id:(t=this.$props.pageMeta)==null?void 0:t.id,name:(o=this.$props.pageMeta)==null?void 0:o.name,slug:(e=this.$props.pageMeta)==null?void 0:e.slug}:{}},parameters(){var t;return!this.$props.composition||!((t=this.$props.composition)!=null&&t.parameters)?{}:this.$props.composition.parameters},componentKey(){return`uniform-composition-${(0,V.v4)()}`}},render(t){return Object.keys(this.slots).length&&this.$scopedSlots.default?t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$scopedSlots.default({slots:this.slots,parameters:this.parameters})):Object.keys(this.slots).length===0&&this.$scopedSlots.default?t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$scopedSlots.default({slots:this.slots,parameters:this.parameters})):t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$slots.default)}};var W={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},Y={margin:"0 0 1rem"},I={name:"default-not-implemented-component",inheritAttrs:!1,props:{component:{type:Object,required:!0}},render(t){var e;let o=(e=this.component)==null?void 0:e.type;return t("div",{key:"content",style:{...W}},[t("h2",{style:{...Y}},`Component: ${o}`),t("p",[t("strong",`${o} has no Vue implementation. It may need to be added to your `),t("code",{},"resolveRenderer() function.")]),t("details",{},[t("summary",{},"props"),t("pre",{style:{overflowX:"auto"}},`${JSON.stringify(this.$props)}`)])])}};var T=require("pascal-case"),u=require("@uniformdev/canvas"),C=require("@uniformdev/optimize-tracker-vue");var g=require("pascal-case"),$=(t,o)=>t.find(e=>e.name===o),y=t=>{let o=[];for(let e in t)o.push({name:e,components:t[e]});return o},L=t=>{let o=e=>(delete e.parameters.intentTag,e);return t.components.map(e=>{var r;return{component:(0,g.pascalCase)(e.type),intentTag:((r=e.parameters.intentTag)==null?void 0:r.value)||{intents:{}},...o(e)}})},q=t=>{let o=e=>e;return t.components.map(e=>({component:(0,g.pascalCase)(e.type),...o(e)}))};var v={name:D,inheritAttrs:!1,props:{uniformData:{type:Object},slotName:{type:String,required:!0},wrapper:{type:[String,Object],default:"div"}},inject:["$__uniformData__"],computed:{slotItems(){return this.uniformData?y(this.uniformData):y(this.$__uniformData__)}},render(t){if(this.slotItems){if(this.slotName){let o=$(this.slotItems,this.slotName),e=o==null?void 0:o.components.map((r,p)=>{let n={uniformData:r};if(r.type===u.CANVAS_TEST_TYPE)return _(t,n,`${r.type}-${p}`);if(r.type===u.CANVAS_PERSONALIZE_TYPE)return k(t,n,`${r.type}-${p}`);let s=(0,T.pascalCase)(r.type);return t(s,{props:n,attrs:{...this.$attrs},key:`${s}-${p}`})});return t(this.wrapper,{key:this.slotName,props:{...this.$props},attrs:{...this.$attrs}},e)}if(!this.slotName){let o=this.slotItems.map((e,r)=>{let p=e==null?void 0:e.components.map((n,s)=>{let i={uniformData:n};if(n.type===u.CANVAS_TEST_TYPE)return _(t,i,`${n.type}-${s}`);if(n.type===u.CANVAS_PERSONALIZE_TYPE)return k(t,i,`${n.type}-${s}`);let m=(0,T.pascalCase)(n.type);return t(m,{props:i,attrs:{...this.$attrs},key:`${m}-${s}`})});return t(this.wrapper,{key:`${e.name}-${r}`},p)});return t(this.wrapper,{key:"slot-content",props:{...this.$props},attrs:{...this.$attrs}},o)}}return t(this.wrapper,{key:"slot-content",props:{...this.$props},attrs:{...this.$attrs}},this.$slots.default)}};function F(t){if(typeof(t==null?void 0:t.value)=="string")return t.value}function k(t,o,e){var s,i,m,d,c;let r=o.uniformData,p=r==null?void 0:r.parameters,n=(0,u.mapSlotToPersonalizedVariations)((s=r==null?void 0:r.slots)==null?void 0:s.pz);return t(C.Personalize,{props:{variations:n,count:Number((m=(i=p==null?void 0:p.count)==null?void 0:i.value)!=null?m:1),trackingEventName:(d=p==null?void 0:p.trackingEventName)==null?void 0:d.value,matchFilter:(c=p==null?void 0:p.matchFilter)==null?void 0:c.value},key:e,scopedSlots:{default:f=>f.variations.map((a,h)=>t(a.type,{props:{uniformData:a},key:`${a.type}-${h}`}))}})}function _(t,o,e){var s,i,m,d,c,f;let r=(m=(i=(s=o.uniformData)==null?void 0:s.slots)==null?void 0:i.test)!=null?m:[],p=((f=(c=(d=o.uniformData)==null?void 0:d.parameters)==null?void 0:c.test)==null?void 0:f.value)||"Untitled Test",n=r.map((a,h)=>{var N,x;return{...a,id:(x=F((N=a.parameters)==null?void 0:N.testId))!=null?x:`variation-${h+1}-${a.type}`}});return t(C.Test,{props:{variations:n,name:p},key:e,scopedSlots:{default:({variant:a})=>t(a.type,{key:`${a.type}-${e}`,props:{uniformData:a}})}})}module.exports=j(K);0&&(module.exports={CANVAS_COMPOSITION_TYPE,CANVAS_SLOT_CONTENT_TYPE,Composition,DefaultNotImplementedComponent,SlotContent,getDataForSlot,mapPzSlotToVariants,mapSlotsData,mapTestSlotToVariants});
1
+ "use strict";var g=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var z=Object.prototype.hasOwnProperty;var U=(e,t)=>{for(var o in t)g(e,o,{get:t[o],enumerable:!0})},w=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of M(t))!z.call(e,r)&&r!==o&&g(e,r,{get:()=>t[r],enumerable:!(n=$(t,r))||n.enumerable});return e};var L=e=>w(g({},"__esModule",{value:!0}),e);var Z={};U(Z,{CANVAS_COMPOSITION_TYPE:()=>b,CANVAS_SLOT_CONTENT_TYPE:()=>R,Composition:()=>v,DefaultNotImplementedComponent:()=>H,SlotContent:()=>B,convertComponentToProps:()=>S,getDataForSlot:()=>A,mapPzSlotToVariants:()=>Y,mapSlotsData:()=>E,mapTestSlotToVariants:()=>j,useCompositionEventEffect:()=>X});module.exports=L(Z);var C=require("vue-demi");var b="Composition",R="SlotContent";var O=require("@uniformdev/canvas"),P=require("@uniformdev/context-vue"),v=(0,C.defineComponent)({name:b,inheritAttrs:!1,props:{composition:{type:Object,required:!0},resolveRenderer:{type:Function,default:C.resolveComponent},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var i,f;let o=(0,C.computed)(()=>e.composition);(0,C.provide)("$__uniformData__",o),(0,C.provide)("$__uniformResolveRenderer__",e.resolveRenderer);let n=(0,C.computed)(()=>{var s,c;return(c=(s=o.value)==null?void 0:s.slots)!=null?c:{}}),r=(0,C.computed)(()=>{var s,c;return(c=(s=o.value)==null?void 0:s.parameters)!=null?c:{}}),p=(0,C.computed)(()=>{var s,c,I,D;return JSON.stringify((D=(I=(c=(s=o.value.slots)==null?void 0:s.content)==null?void 0:c[0].parameters)==null?void 0:I.title)==null?void 0:D.value)}),a=(0,P.useUniformContext)()!==void 0,m=(f=(i=o.value.parameters)==null?void 0:i[O.CANVAS_ENRICHMENT_TAG_PARAM])==null?void 0:f.value,d=e.behaviorTracking==="onLoad"?P.TrackSlot:P.Track,u=()=>{var s,c;return(c=(s=t.slots).default)==null?void 0:c.call(s,{slots:n.value,parameters:r.value})};return a?()=>(0,C.h)(d,{behavior:m,key:p.value},u):u}});var l=require("vue-demi"),T=require("@uniformdev/canvas"),_=require("@uniformdev/context-vue");var x=require("pascal-case"),A=(e,t)=>e.find(o=>o.name===t),E=e=>{let t=[];for(let o in e)t.push({name:o,components:e[o]});return t},Y=e=>{let t=o=>(delete o.parameters.intentTag,o);return e.components.map(o=>{var n;return{component:(0,x.pascalCase)(o.type),intentTag:((n=o.parameters.intentTag)==null?void 0:n.value)||{intents:{}},...t(o)}})},j=e=>{let t=o=>o;return e.components.map(o=>({component:(0,x.pascalCase)(o.type),...t(o)}))};function S(e){var r;let t=(r=e.parameters)!=null?r:{};return{...Object.entries(t).reduce((p,[a,{value:m}])=>({...p,[F(a)]:m}),{}),...e.data,component:e}}function F(e){return e.replace("$","")}function q(e){if(typeof(e==null?void 0:e.value)=="string")return e.value}function h(e,t,o){var p,a,m;let n=e==null?void 0:e.parameters,r=(0,T.mapSlotToPersonalizedVariations)((p=e.slots)==null?void 0:p.pz);return(0,l.h)(_.Personalize,{name:o,component:d=>{let u=S(d),i=()=>(0,l.h)(t(d.type),u);return(0,l.h)(v,{composition:u.component},i)},variations:r,count:Number((m=(a=n==null?void 0:n.count)==null?void 0:a.value)!=null?m:1),key:o})}function k(e,t,o){var a,m,d,u;let n=(m=(a=e==null?void 0:e.slots)==null?void 0:a.test)!=null?m:[],r=((u=(d=e==null?void 0:e.parameters)==null?void 0:d.test)==null?void 0:u.value)||"Untitled Test",p=n.map((i,f)=>{var s,c;return{...i,id:(c=q((s=i.parameters)==null?void 0:s.testId))!=null?c:`variation-${f+1}-${i.type}`}});return(0,l.h)(_.Test,{variations:p,name:r,key:o,component:i=>{let f=S(i),s=()=>(0,l.h)(t(i.type),f);return(0,l.h)(v,{composition:f.component},s)}})}var B=(0,l.defineComponent)({name:R,inheritAttrs:!1,props:{slotName:{type:String,required:!0}},setup(e,t){let o=(0,l.inject)("$__uniformData__"),n=(0,l.inject)("$__uniformResolveRenderer__"),r=(0,l.computed)(()=>{var p;return E((p=o.value.slots)!=null?p:{})});if(e.slotName){let p=A(r.value,e.slotName);return()=>{var a;return(a=p==null?void 0:p.components.map((m,d)=>{let u=S(m),i=m.type,f=`${i}-${d}`,s=n(i),c=()=>(0,l.h)(s,{...u,...t.attrs,key:f});return m.type===T.CANVAS_TEST_TYPE&&(c=()=>k(m,n,f)),m.type===T.CANVAS_PERSONALIZE_TYPE&&(c=()=>h(m,n,f)),(0,l.h)(v,{composition:u.component},c)}))!=null?a:[]}}return()=>r.value.map(p=>p==null?void 0:p.components.map((a,m)=>{let d=S(a),u=a.type,i=`${u}-${m}`,f=n(u),s=()=>(0,l.h)(f,{...d,...t.attrs,key:i});return a.type===T.CANVAS_TEST_TYPE&&(s=()=>k(a,n,i)),a.type===T.CANVAS_PERSONALIZE_TYPE&&(s=()=>h(a,n,i)),(0,l.h)(v,{composition:d.component},s)}))}});var y=require("vue-demi"),J={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},G={margin:"0 0 1rem"},H=(0,y.defineComponent)({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(e,{attrs:t}){var n;let o=(n=e.component)==null?void 0:n.type;return()=>(0,y.h)("div",{key:"content",style:{...J}},[(0,y.h)("h2",{style:{...G}},`Component: ${o}`),(0,y.h)("p",[(0,y.h)("strong",`${o} has no Vue implementation. It may need to be added to your `),(0,y.h)("code",{},"resolveRenderer()"),(0,y.h)("strong",{}," function.")]),(0,y.h)("details",{},[(0,y.h)("summary",{},"props/attributes"),(0,y.h)("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});var N=require("@uniformdev/canvas"),V=require("vue-demi");async function X({enabled:e,projectId:t,compositionIdRef:o,effect:n}){let r;(0,V.watch)([()=>e,()=>o.value,()=>t],async()=>{if(r==null||r(),!e||!o.value||!t)return;let p=await(0,N.createEventBus)();p&&(r=(0,N.subscribeToComposition)({eventBus:p,compositionId:o.value,compositionState:N.CANVAS_DRAFT_STATE,projectId:t,callback:n,event:"updated"}))},{immediate:!0})}0&&(module.exports={CANVAS_COMPOSITION_TYPE,CANVAS_SLOT_CONTENT_TYPE,Composition,DefaultNotImplementedComponent,SlotContent,convertComponentToProps,getDataForSlot,mapPzSlotToVariants,mapSlotsData,mapTestSlotToVariants,useCompositionEventEffect});
package/dist/index.mjs CHANGED
@@ -1 +1 @@
1
- import{v4 as I}from"uuid";var S="Composition",D="SlotContent";var g={watch:{"$route.query"(){this.reevaluateSignals()}},mounted(){this.$nextTick(()=>{this.reevaluateSignals()})},methods:{reevaluateSignals(){this.$uniformOptimizeContext&&(this.$uniformOptimizeContext.trackerInitializing||this.$uniformOptimizeContext.tracker.reevaluateSignals())}}};var k={name:S,inheritAttrs:!1,props:{composition:{type:Object,required:!0},pageMeta:{type:Object},wrapper:{type:[String,Object],default:"div"}},mixins:[g],provide(){var t;return{$__uniformData__:(t=this.$props.composition)==null?void 0:t.slots}},computed:{slots(){return!this.$props.composition||!this.$props.composition.slots?{}:this.$props.composition.slots},pageMetaData(){var t,o,e;if(!!this.$props.pageMeta)return Object.keys(this.$props.pageMeta).length?{id:(t=this.$props.pageMeta)==null?void 0:t.id,name:(o=this.$props.pageMeta)==null?void 0:o.name,slug:(e=this.$props.pageMeta)==null?void 0:e.slug}:{}},parameters(){var t;return!this.$props.composition||!((t=this.$props.composition)!=null&&t.parameters)?{}:this.$props.composition.parameters},componentKey(){return`uniform-composition-${I()}`}},render(t){return Object.keys(this.slots).length&&this.$scopedSlots.default?t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$scopedSlots.default({slots:this.slots,parameters:this.parameters})):Object.keys(this.slots).length===0&&this.$scopedSlots.default?t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$scopedSlots.default({slots:this.slots,parameters:this.parameters})):t(this.wrapper,{key:this.componentKey,attrs:{...this.$attrs}},this.$slots.default)}};var _={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},v={margin:"0 0 1rem"},E={name:"default-not-implemented-component",inheritAttrs:!1,props:{component:{type:Object,required:!0}},render(t){var e;let o=(e=this.component)==null?void 0:e.type;return t("div",{key:"content",style:{..._}},[t("h2",{style:{...v}},`Component: ${o}`),t("p",[t("strong",`${o} has no Vue implementation. It may need to be added to your `),t("code",{},"resolveRenderer() function.")]),t("details",{},[t("summary",{},"props"),t("pre",{style:{overflowX:"auto"}},`${JSON.stringify(this.$props)}`)])])}};import{pascalCase as N}from"pascal-case";import{CANVAS_PERSONALIZE_TYPE as x,CANVAS_TEST_TYPE as M,mapSlotToPersonalizedVariations as w}from"@uniformdev/canvas";import{Personalize as R,Test as b}from"@uniformdev/optimize-tracker-vue";import{pascalCase as $}from"pascal-case";var T=(t,o)=>t.find(e=>e.name===o),C=t=>{let o=[];for(let e in t)o.push({name:e,components:t[e]});return o},J=t=>{let o=e=>(delete e.parameters.intentTag,e);return t.components.map(e=>{var r;return{component:$(e.type),intentTag:((r=e.parameters.intentTag)==null?void 0:r.value)||{intents:{}},...o(e)}})},X=t=>{let o=e=>e;return t.components.map(e=>({component:$(e.type),...o(e)}))};var A={name:D,inheritAttrs:!1,props:{uniformData:{type:Object},slotName:{type:String,required:!0},wrapper:{type:[String,Object],default:"div"}},inject:["$__uniformData__"],computed:{slotItems(){return this.uniformData?C(this.uniformData):C(this.$__uniformData__)}},render(t){if(this.slotItems){if(this.slotName){let o=T(this.slotItems,this.slotName),e=o==null?void 0:o.components.map((r,p)=>{let n={uniformData:r};if(r.type===M)return O(t,n,`${r.type}-${p}`);if(r.type===x)return V(t,n,`${r.type}-${p}`);let s=N(r.type);return t(s,{props:n,attrs:{...this.$attrs},key:`${s}-${p}`})});return t(this.wrapper,{key:this.slotName,props:{...this.$props},attrs:{...this.$attrs}},e)}if(!this.slotName){let o=this.slotItems.map((e,r)=>{let p=e==null?void 0:e.components.map((n,s)=>{let i={uniformData:n};if(n.type===M)return O(t,i,`${n.type}-${s}`);if(n.type===x)return V(t,i,`${n.type}-${s}`);let m=N(n.type);return t(m,{props:i,attrs:{...this.$attrs},key:`${m}-${s}`})});return t(this.wrapper,{key:`${e.name}-${r}`},p)});return t(this.wrapper,{key:"slot-content",props:{...this.$props},attrs:{...this.$attrs}},o)}}return t(this.wrapper,{key:"slot-content",props:{...this.$props},attrs:{...this.$attrs}},this.$slots.default)}};function z(t){if(typeof(t==null?void 0:t.value)=="string")return t.value}function V(t,o,e){var s,i,m,d,c;let r=o.uniformData,p=r==null?void 0:r.parameters,n=w((s=r==null?void 0:r.slots)==null?void 0:s.pz);return t(R,{props:{variations:n,count:Number((m=(i=p==null?void 0:p.count)==null?void 0:i.value)!=null?m:1),trackingEventName:(d=p==null?void 0:p.trackingEventName)==null?void 0:d.value,matchFilter:(c=p==null?void 0:p.matchFilter)==null?void 0:c.value},key:e,scopedSlots:{default:f=>f.variations.map((a,y)=>t(a.type,{props:{uniformData:a},key:`${a.type}-${y}`}))}})}function O(t,o,e){var s,i,m,d,c,f;let r=(m=(i=(s=o.uniformData)==null?void 0:s.slots)==null?void 0:i.test)!=null?m:[],p=((f=(c=(d=o.uniformData)==null?void 0:d.parameters)==null?void 0:c.test)==null?void 0:f.value)||"Untitled Test",n=r.map((a,y)=>{var h,P;return{...a,id:(P=z((h=a.parameters)==null?void 0:h.testId))!=null?P:`variation-${y+1}-${a.type}`}});return t(b,{props:{variations:n,name:p},key:e,scopedSlots:{default:({variant:a})=>t(a.type,{key:`${a.type}-${e}`,props:{uniformData:a}})}})}export{S as CANVAS_COMPOSITION_TYPE,D as CANVAS_SLOT_CONTENT_TYPE,k as Composition,E as DefaultNotImplementedComponent,A as SlotContent,T as getDataForSlot,J as mapPzSlotToVariants,C as mapSlotsData,X as mapTestSlotToVariants};
1
+ "use strict";import{defineComponent as h,computed as P,h as k,provide as g,resolveComponent as V}from"vue-demi";var N="Composition",_="SlotContent";import{CANVAS_ENRICHMENT_TAG_PARAM as $}from"@uniformdev/canvas";import{Track as M,TrackSlot as z,useUniformContext as U}from"@uniformdev/context-vue";var y=h({name:N,inheritAttrs:!1,props:{composition:{type:Object,required:!0},resolveRenderer:{type:Function,default:V},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var m,u;let o=P(()=>e.composition);g("$__uniformData__",o),g("$__uniformResolveRenderer__",e.resolveRenderer);let n=P(()=>{var p,i;return(i=(p=o.value)==null?void 0:p.slots)!=null?i:{}}),c=P(()=>{var p,i;return(i=(p=o.value)==null?void 0:p.parameters)!=null?i:{}}),r=P(()=>{var p,i,v,S;return JSON.stringify((S=(v=(i=(p=o.value.slots)==null?void 0:p.content)==null?void 0:i[0].parameters)==null?void 0:v.title)==null?void 0:S.value)}),s=U()!==void 0,a=(u=(m=o.value.parameters)==null?void 0:m[$])==null?void 0:u.value,C=e.behaviorTracking==="onLoad"?z:M,l=()=>{var p,i;return(i=(p=t.slots).default)==null?void 0:i.call(p,{slots:n.value,parameters:c.value})};return s?()=>k(C,{behavior:a,key:r.value},l):l}});import{defineComponent as L,computed as Y,h as f,inject as A}from"vue-demi";import{CANVAS_PERSONALIZE_TYPE as E,CANVAS_TEST_TYPE as I,mapSlotToPersonalizedVariations as j}from"@uniformdev/canvas";import{Personalize as F,Test as q}from"@uniformdev/context-vue";import{pascalCase as b}from"pascal-case";var R=(e,t)=>e.find(o=>o.name===t),x=e=>{let t=[];for(let o in e)t.push({name:o,components:e[o]});return t},se=e=>{let t=o=>(delete o.parameters.intentTag,o);return e.components.map(o=>{var n;return{component:b(o.type),intentTag:((n=o.parameters.intentTag)==null?void 0:n.value)||{intents:{}},...t(o)}})},ae=e=>{let t=o=>o;return e.components.map(o=>({component:b(o.type),...t(o)}))};function T(e){var c;let t=(c=e.parameters)!=null?c:{};return{...Object.entries(t).reduce((r,[s,{value:a}])=>({...r,[w(s)]:a}),{}),...e.data,component:e}}function w(e){return e.replace("$","")}function B(e){if(typeof(e==null?void 0:e.value)=="string")return e.value}function D(e,t,o){var r,s,a;let n=e==null?void 0:e.parameters,c=j((r=e.slots)==null?void 0:r.pz);return f(F,{name:o,component:C=>{let l=T(C),m=()=>f(t(C.type),l);return f(y,{composition:l.component},m)},variations:c,count:Number((a=(s=n==null?void 0:n.count)==null?void 0:s.value)!=null?a:1),key:o})}function O(e,t,o){var s,a,C,l;let n=(a=(s=e==null?void 0:e.slots)==null?void 0:s.test)!=null?a:[],c=((l=(C=e==null?void 0:e.parameters)==null?void 0:C.test)==null?void 0:l.value)||"Untitled Test",r=n.map((m,u)=>{var p,i;return{...m,id:(i=B((p=m.parameters)==null?void 0:p.testId))!=null?i:`variation-${u+1}-${m.type}`}});return f(q,{variations:r,name:c,key:o,component:m=>{let u=T(m),p=()=>f(t(m.type),u);return f(y,{composition:u.component},p)}})}var Pe=L({name:_,inheritAttrs:!1,props:{slotName:{type:String,required:!0}},setup(e,t){let o=A("$__uniformData__"),n=A("$__uniformResolveRenderer__"),c=Y(()=>{var r;return x((r=o.value.slots)!=null?r:{})});if(e.slotName){let r=R(c.value,e.slotName);return()=>{var s;return(s=r==null?void 0:r.components.map((a,C)=>{let l=T(a),m=a.type,u=`${m}-${C}`,p=n(m),i=()=>f(p,{...l,...t.attrs,key:u});return a.type===I&&(i=()=>O(a,n,u)),a.type===E&&(i=()=>D(a,n,u)),f(y,{composition:l.component},i)}))!=null?s:[]}}return()=>c.value.map(r=>r==null?void 0:r.components.map((s,a)=>{let C=T(s),l=s.type,m=`${l}-${a}`,u=n(l),p=()=>f(u,{...C,...t.attrs,key:m});return s.type===I&&(p=()=>O(s,n,m)),s.type===E&&(p=()=>D(s,n,m)),f(y,{composition:C.component},p)}))}});import{defineComponent as J,h as d}from"vue-demi";var G={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},H={margin:"0 0 1rem"},_e=J({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(e,{attrs:t}){var n;let o=(n=e.component)==null?void 0:n.type;return()=>d("div",{key:"content",style:{...G}},[d("h2",{style:{...H}},`Component: ${o}`),d("p",[d("strong",`${o} has no Vue implementation. It may need to be added to your `),d("code",{},"resolveRenderer()"),d("strong",{}," function.")]),d("details",{},[d("summary",{},"props/attributes"),d("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});import{CANVAS_DRAFT_STATE as X,createEventBus as Z,subscribeToComposition as K}from"@uniformdev/canvas";import{watch as Q}from"vue-demi";async function xe({enabled:e,projectId:t,compositionIdRef:o,effect:n}){let c;Q([()=>e,()=>o.value,()=>t],async()=>{if(c==null||c(),!e||!o.value||!t)return;let r=await Z();r&&(c=K({eventBus:r,compositionId:o.value,compositionState:X,projectId:t,callback:n,event:"updated"}))},{immediate:!0})}export{N as CANVAS_COMPOSITION_TYPE,_ as CANVAS_SLOT_CONTENT_TYPE,y as Composition,_e as DefaultNotImplementedComponent,Pe as SlotContent,T as convertComponentToProps,R as getDataForSlot,se as mapPzSlotToVariants,x as mapSlotsData,ae as mapTestSlotToVariants,xe as useCompositionEventEffect};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uniformdev/canvas-vue",
3
- "version": "14.2.1-alpha.256+3b08eaee2",
3
+ "version": "16.0.1-alpha.143+8bf270fcc",
4
4
  "description": "Vue SDK for Uniform Canvas",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "main": "./dist/index.js",
@@ -23,22 +23,27 @@
23
23
  "format": "prettier --write \"src/**/*.{js,ts,tsx}\""
24
24
  },
25
25
  "dependencies": {
26
- "@uniformdev/canvas": "^14.2.1-alpha.256+3b08eaee2",
27
- "@uniformdev/optimize-common": "^14.2.0",
28
- "@uniformdev/optimize-tracker-browser": "^14.2.0",
29
- "@uniformdev/optimize-tracker-common": "^14.2.0",
30
- "@uniformdev/optimize-tracker-vue": "^14.2.0",
26
+ "@uniformdev/canvas": "^16.0.1-alpha.143+8bf270fcc",
27
+ "@uniformdev/context-vue": "^16.0.1-alpha.143+8bf270fcc",
31
28
  "@vue/test-utils": "1.3.0",
32
- "pascal-case": "^3.1.2",
33
- "uuid": "^8.3.2"
29
+ "pascal-case": "3.1.2",
30
+ "uuid": "8.3.2",
31
+ "vue-demi": "^0.12.5"
34
32
  },
35
33
  "peerDependencies": {
36
- "vue": ">=2.6 <3.0"
34
+ "@vue/composition-api": "^1.0.0-rc.1",
35
+ "vue": "^2.0.0 || >=3.0.0"
36
+ },
37
+ "peerDependenciesMeta": {
38
+ "@vue/composition-api": {
39
+ "optional": true
40
+ }
37
41
  },
38
42
  "devDependencies": {
39
43
  "@testing-library/vue": "6.5.1",
44
+ "@types/uuid": "8.3.4",
40
45
  "@vue/server-test-utils": "1.3.0",
41
- "vue": "2.6.14",
46
+ "vue": "3.2.25",
42
47
  "vue-server-renderer": "2.6.14",
43
48
  "vue-template-compiler": "2.6.14"
44
49
  },
@@ -59,5 +64,5 @@
59
64
  "last 2 versions",
60
65
  "not dead"
61
66
  ],
62
- "gitHead": "3b08eaee27018fbfe1ac4b2bc7e1d6cefb4b9bdf"
67
+ "gitHead": "8bf270fcc0cc82383d1f30311fe11dafd5fe3782"
63
68
  }