@uniformdev/canvas-vue 16.0.1-alpha.128 → 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.
package/dist/index.d.ts CHANGED
@@ -1,13 +1,12 @@
1
- import { Component } from 'vue-demi';
2
- import { ComponentInstance } from '@uniformdev/canvas';
1
+ import { resolveComponent, Component, Ref } from 'vue-demi';
2
+ import { ComponentInstance, ComponentParameter, SubscribeToCompositionOptions } from '@uniformdev/canvas';
3
3
 
4
- /**
5
- * Generates a Composition Vue Component
6
- * @vue-prop {Object} composition - A dynamic vue component that provides data to the Uniform Canvas SlotContent component via provide/inject
7
- * @vue-computed {Object} slots - returns Uniform Canvas slot data
8
- * @vue-computed {Object | undefined} pageMetaData - returns undefined or an object of keys / values (id, name, slug)
9
- * @vue-computed {Object} parameters - returns and empty object or a object of parameters
10
- */
4
+ declare type CompositionProps = {
5
+ /** A dynamic vue component that provides data to the Uniform Canvas SlotContent component via provide/inject */
6
+ composition: ComponentInstance;
7
+ resolveRenderer?: typeof resolveComponent;
8
+ behaviorTracking?: 'onLoad' | 'onView';
9
+ };
11
10
  declare const Composition: Component;
12
11
 
13
12
  declare type SlotComponentProps = {
@@ -19,6 +18,9 @@ declare type SlotComponentProps = {
19
18
  */
20
19
  declare const SlotContent: Component;
21
20
 
21
+ declare type DefaultNotImplementedComponentProps = {
22
+ component: ComponentInstance;
23
+ };
22
24
  declare const DefaultNotImplementedComponent: Component;
23
25
 
24
26
  declare type MapComponentNameProps = {
@@ -27,6 +29,23 @@ declare type MapComponentNameProps = {
27
29
  };
28
30
  declare type SlotDataProps = Record<string, any>;
29
31
  declare type MapSlotDataResolve = Array<MapComponentNameProps>;
32
+ interface TestComponent {
33
+ slots?: {
34
+ test?: ComponentInstance[];
35
+ };
36
+ parameters: {
37
+ test?: ComponentParameter<string | undefined>;
38
+ };
39
+ }
40
+ interface PersonalizeComponent {
41
+ slots?: {
42
+ pz?: ComponentInstance[];
43
+ };
44
+ parameters: {
45
+ trackingEventName?: ComponentParameter<string>;
46
+ count?: ComponentParameter<string | number>;
47
+ };
48
+ }
30
49
  /**
31
50
  * Props passed to a Canvas component implementation.
32
51
  * TProps is the Canvas component's parameters object after
@@ -75,9 +94,17 @@ declare const mapTestSlotToVariants: (slotData: MapComponentNameProps) => {
75
94
  */
76
95
  declare function convertComponentToProps<T = unknown>(component: ComponentInstance): ComponentProps<T>;
77
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
+
78
105
  /** Public ID of Canvas composition component type */
79
106
  declare const CANVAS_COMPOSITION_TYPE = "Composition";
80
107
  /** Public ID of Canvas slot component component type */
81
108
  declare const CANVAS_SLOT_CONTENT_TYPE = "SlotContent";
82
109
 
83
- export { CANVAS_COMPOSITION_TYPE, CANVAS_SLOT_CONTENT_TYPE, ComponentProps, Composition, DefaultNotImplementedComponent, MapComponentNameProps, MapSlotDataResolve, SlotComponentProps, SlotContent, SlotDataProps, convertComponentToProps, 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{defineComponent as h,computed as S,h as k,provide as N,resolveComponent as V}from"vue-demi";var T="Composition",v="SlotContent";import{CANVAS_ENRICHMENT_TAG_PARAM as E}from"@uniformdev/canvas";import{Track as O,TrackSlot as M,useUniformContext as $,uniformContextStoreProps as z}from"@uniformdev/context-vue";var y=h({name:T,inheritAttrs:!1,props:{composition:{type:Object,required:!0},resolveRenderer:{type:Function,default:V},behaviorTracking:{type:String,default:"onView"}},setup(o,p){var n,i;N("$__uniformData__",o.composition.slots),N("$__uniformResolveRenderer__",o.resolveRenderer);let e=S(()=>{var t,r;return(r=(t=o.composition)==null?void 0:t.slots)!=null?r:{}}),s=S(()=>{var t,r;return(r=(t=o.composition)==null?void 0:t.parameters)!=null?r:{}}),l=$(z)!==void 0,a=(i=(n=o.composition.parameters)==null?void 0:n[E])==null?void 0:i.value,m=o.behaviorTracking==="onLoad"?M:O;return l?()=>{var t,r;return k(m,{behavior:a},(r=(t=p.slots).default)==null?void 0:r.call(t,{slots:e.value,parameters:s.value}))}:()=>{var t,r;return(r=(t=p.slots).default)==null?void 0:r.call(t,{slots:e.value,parameters:s.value})}}});import{defineComponent as j,computed as L,h as u,inject as R}from"vue-demi";import{CANVAS_PERSONALIZE_TYPE as D,CANVAS_TEST_TYPE as I,mapSlotToPersonalizedVariations as Y}from"@uniformdev/canvas";import{Personalize as q,Test as F}from"@uniformdev/context-vue";import{pascalCase as g}from"pascal-case";var _=(o,p)=>o.find(e=>e.name===p),x=o=>{let p=[];for(let e in o)p.push({name:e,components:o[e]});return p},no=o=>{let p=e=>(delete e.parameters.intentTag,e);return o.components.map(e=>{var s;return{component:g(e.type),intentTag:((s=e.parameters.intentTag)==null?void 0:s.value)||{intents:{}},...p(e)}})},ro=o=>{let p=e=>e;return o.components.map(e=>({component:g(e.type),...p(e)}))};function P(o){var l;let p=(l=o.parameters)!=null?l:{};return{...Object.entries(p).reduce((a,[m,{value:n}])=>({...a,[w(m)]:n}),{}),...o.data,component:o}}function w(o){return o.replace("$","")}function U(o){if(typeof(o==null?void 0:o.value)=="string")return o.value}function A(o,p,e){var a,m,n;let s=o==null?void 0:o.parameters,l=Y((a=o.slots)==null?void 0:a.pz);return u(q,{name:e,component:i=>{let t=P(i),r=u(p(i.type),t);return u(y,{composition:t.component},r)},variations:l,count:Number((n=(m=s==null?void 0:s.count)==null?void 0:m.value)!=null?n:1),key:e})}function b(o,p){var a,m,n,i;let e=(m=(a=o==null?void 0:o.slots)==null?void 0:a.test)!=null?m:[],s=((i=(n=o==null?void 0:o.parameters)==null?void 0:n.test)==null?void 0:i.value)||"Untitled Test",l=e.map((t,r)=>{var c,d;return{...t,id:(d=U((c=t.parameters)==null?void 0:c.testId))!=null?d:`variation-${r+1}-${t.type}`}});return u(F,{variations:l,name:s,key:p},{default:({variant:t})=>{let r=P(t);return u(t.type,r)}})}var G=j({name:v,inheritAttrs:!1,props:{slotName:{type:String,required:!0}},setup(o,p){let e=R("$__uniformData__"),s=R("$__uniformResolveRenderer__"),l=L(()=>x(e));if(o.slotName){let a=_(l.value,o.slotName);return()=>{var m;return(m=a==null?void 0:a.components.map((n,i)=>{let t=P(n),r=n.type,c=`${r}-${i}`,d=s(r),f=u(d,{...t,...p.attrs,key:c});return n.type===I&&(f=b(n,c)),n.type===D&&(f=A(n,s,c)),u(y,{composition:t.component},f)}))!=null?m:[]}}return()=>l.value.map((a,m)=>a==null?void 0:a.components.map((n,i)=>{let t=P(n),r=n.type,c=`${r}-${i}`,d=s(r),f=u(d,{...t,...p.attrs,key:c});return n.type===I&&(f=b(n,c)),n.type===D&&(f=A(n,s,c)),u(y,{composition:t.component},f)}))}});import{defineComponent as H,h as C}from"vue-demi";var J={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},X={margin:"0 0 1rem"},Z=H({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(o,{attrs:p}){var s;let e=(s=o.component)==null?void 0:s.type;return()=>C("div",{key:"content",style:{...J}},[C("h2",{style:{...X}},`Component: ${e}`),C("p",[C("strong",`${e} has no Vue implementation. It may need to be added to your `),C("code",{},"resolveRenderer()"),C("strong",{}," function.")]),C("details",{},[C("summary",{},"props/attributes"),C("pre",{style:{overflowX:"auto"}},`${JSON.stringify(p)}`)])])}});export{T as CANVAS_COMPOSITION_TYPE,v as CANVAS_SLOT_CONTENT_TYPE,y as Composition,Z as DefaultNotImplementedComponent,G as SlotContent,P as convertComponentToProps,_ as getDataForSlot,no as mapPzSlotToVariants,x as mapSlotsData,ro 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 g=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var M=Object.prototype.hasOwnProperty;var $=(o,t)=>{for(var e in t)g(o,e,{get:t[e],enumerable:!0})},z=(o,t,e,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of O(t))!M.call(o,a)&&a!==e&&g(o,a,{get:()=>t[a],enumerable:!(p=E(t,a))||p.enumerable});return o};var w=o=>z(g({},"__esModule",{value:!0}),o);var G={};$(G,{CANVAS_COMPOSITION_TYPE:()=>_,CANVAS_SLOT_CONTENT_TYPE:()=>x,Composition:()=>S,DefaultNotImplementedComponent:()=>V,SlotContent:()=>k,convertComponentToProps:()=>T,getDataForSlot:()=>D,mapPzSlotToVariants:()=>j,mapSlotsData:()=>I,mapTestSlotToVariants:()=>L});module.exports=w(G);var u=require("vue-demi");var _="Composition",x="SlotContent";var A=require("@uniformdev/canvas"),d=require("@uniformdev/context-vue"),S=(0,u.defineComponent)({name:_,inheritAttrs:!1,props:{composition:{type:Object,required:!0},resolveRenderer:{type:Function,default:u.resolveComponent},behaviorTracking:{type:String,default:"onView"}},setup(o,t){var r,c;(0,u.provide)("$__uniformData__",o.composition.slots),(0,u.provide)("$__uniformResolveRenderer__",o.resolveRenderer);let e=(0,u.computed)(()=>{var n,s;return(s=(n=o.composition)==null?void 0:n.slots)!=null?s:{}}),p=(0,u.computed)(()=>{var n,s;return(s=(n=o.composition)==null?void 0:n.parameters)!=null?s:{}}),a=(0,d.useUniformContext)(d.uniformContextStoreProps)!==void 0,m=(c=(r=o.composition.parameters)==null?void 0:r[A.CANVAS_ENRICHMENT_TAG_PARAM])==null?void 0:c.value,l=o.behaviorTracking==="onLoad"?d.TrackSlot:d.Track;return a?()=>{var n,s;return(0,u.h)(l,{behavior:m},(s=(n=t.slots).default)==null?void 0:s.call(n,{slots:e.value,parameters:p.value}))}:()=>{var n,s;return(s=(n=t.slots).default)==null?void 0:s.call(n,{slots:e.value,parameters:p.value})}}});var i=require("vue-demi"),P=require("@uniformdev/canvas"),N=require("@uniformdev/context-vue");var R=require("pascal-case"),D=(o,t)=>o.find(e=>e.name===t),I=o=>{let t=[];for(let e in o)t.push({name:e,components:o[e]});return t},j=o=>{let t=e=>(delete e.parameters.intentTag,e);return o.components.map(e=>{var p;return{component:(0,R.pascalCase)(e.type),intentTag:((p=e.parameters.intentTag)==null?void 0:p.value)||{intents:{}},...t(e)}})},L=o=>{let t=e=>e;return o.components.map(e=>({component:(0,R.pascalCase)(e.type),...t(e)}))};function T(o){var a;let t=(a=o.parameters)!=null?a:{};return{...Object.entries(t).reduce((m,[l,{value:r}])=>({...m,[Y(l)]:r}),{}),...o.data,component:o}}function Y(o){return o.replace("$","")}function q(o){if(typeof(o==null?void 0:o.value)=="string")return o.value}function b(o,t,e){var m,l,r;let p=o==null?void 0:o.parameters,a=(0,P.mapSlotToPersonalizedVariations)((m=o.slots)==null?void 0:m.pz);return(0,i.h)(N.Personalize,{name:e,component:c=>{let n=T(c),s=(0,i.h)(t(c.type),n);return(0,i.h)(S,{composition:n.component},s)},variations:a,count:Number((r=(l=p==null?void 0:p.count)==null?void 0:l.value)!=null?r:1),key:e})}function h(o,t){var m,l,r,c;let e=(l=(m=o==null?void 0:o.slots)==null?void 0:m.test)!=null?l:[],p=((c=(r=o==null?void 0:o.parameters)==null?void 0:r.test)==null?void 0:c.value)||"Untitled Test",a=e.map((n,s)=>{var f,v;return{...n,id:(v=q((f=n.parameters)==null?void 0:f.testId))!=null?v:`variation-${s+1}-${n.type}`}});return(0,i.h)(N.Test,{variations:a,name:p,key:t},{default:({variant:n})=>{let s=T(n);return(0,i.h)(n.type,s)}})}var k=(0,i.defineComponent)({name:x,inheritAttrs:!1,props:{slotName:{type:String,required:!0}},setup(o,t){let e=(0,i.inject)("$__uniformData__"),p=(0,i.inject)("$__uniformResolveRenderer__"),a=(0,i.computed)(()=>I(e));if(o.slotName){let m=D(a.value,o.slotName);return()=>{var l;return(l=m==null?void 0:m.components.map((r,c)=>{let n=T(r),s=r.type,f=`${s}-${c}`,v=p(s),y=(0,i.h)(v,{...n,...t.attrs,key:f});return r.type===P.CANVAS_TEST_TYPE&&(y=h(r,f)),r.type===P.CANVAS_PERSONALIZE_TYPE&&(y=b(r,p,f)),(0,i.h)(S,{composition:n.component},y)}))!=null?l:[]}}return()=>a.value.map((m,l)=>m==null?void 0:m.components.map((r,c)=>{let n=T(r),s=r.type,f=`${s}-${c}`,v=p(s),y=(0,i.h)(v,{...n,...t.attrs,key:f});return r.type===P.CANVAS_TEST_TYPE&&(y=h(r,f)),r.type===P.CANVAS_PERSONALIZE_TYPE&&(y=b(r,p,f)),(0,i.h)(S,{composition:n.component},y)}))}});var C=require("vue-demi"),F={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},U={margin:"0 0 1rem"},V=(0,C.defineComponent)({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(o,{attrs:t}){var p;let e=(p=o.component)==null?void 0:p.type;return()=>(0,C.h)("div",{key:"content",style:{...F}},[(0,C.h)("h2",{style:{...U}},`Component: ${e}`),(0,C.h)("p",[(0,C.h)("strong",`${e} has no Vue implementation. It may need to be added to your `),(0,C.h)("code",{},"resolveRenderer()"),(0,C.h)("strong",{}," function.")]),(0,C.h)("details",{},[(0,C.h)("summary",{},"props/attributes"),(0,C.h)("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});0&&(module.exports={CANVAS_COMPOSITION_TYPE,CANVAS_SLOT_CONTENT_TYPE,Composition,DefaultNotImplementedComponent,SlotContent,convertComponentToProps,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{defineComponent as h,computed as S,h as k,provide as N,resolveComponent as V}from"vue-demi";var T="Composition",v="SlotContent";import{CANVAS_ENRICHMENT_TAG_PARAM as E}from"@uniformdev/canvas";import{Track as O,TrackSlot as M,useUniformContext as $,uniformContextStoreProps as z}from"@uniformdev/context-vue";var y=h({name:T,inheritAttrs:!1,props:{composition:{type:Object,required:!0},resolveRenderer:{type:Function,default:V},behaviorTracking:{type:String,default:"onView"}},setup(o,p){var n,i;N("$__uniformData__",o.composition.slots),N("$__uniformResolveRenderer__",o.resolveRenderer);let e=S(()=>{var t,r;return(r=(t=o.composition)==null?void 0:t.slots)!=null?r:{}}),s=S(()=>{var t,r;return(r=(t=o.composition)==null?void 0:t.parameters)!=null?r:{}}),l=$(z)!==void 0,a=(i=(n=o.composition.parameters)==null?void 0:n[E])==null?void 0:i.value,m=o.behaviorTracking==="onLoad"?M:O;return l?()=>{var t,r;return k(m,{behavior:a},(r=(t=p.slots).default)==null?void 0:r.call(t,{slots:e.value,parameters:s.value}))}:()=>{var t,r;return(r=(t=p.slots).default)==null?void 0:r.call(t,{slots:e.value,parameters:s.value})}}});import{defineComponent as j,computed as L,h as u,inject as R}from"vue-demi";import{CANVAS_PERSONALIZE_TYPE as D,CANVAS_TEST_TYPE as I,mapSlotToPersonalizedVariations as Y}from"@uniformdev/canvas";import{Personalize as q,Test as F}from"@uniformdev/context-vue";import{pascalCase as g}from"pascal-case";var _=(o,p)=>o.find(e=>e.name===p),x=o=>{let p=[];for(let e in o)p.push({name:e,components:o[e]});return p},no=o=>{let p=e=>(delete e.parameters.intentTag,e);return o.components.map(e=>{var s;return{component:g(e.type),intentTag:((s=e.parameters.intentTag)==null?void 0:s.value)||{intents:{}},...p(e)}})},ro=o=>{let p=e=>e;return o.components.map(e=>({component:g(e.type),...p(e)}))};function P(o){var l;let p=(l=o.parameters)!=null?l:{};return{...Object.entries(p).reduce((a,[m,{value:n}])=>({...a,[w(m)]:n}),{}),...o.data,component:o}}function w(o){return o.replace("$","")}function U(o){if(typeof(o==null?void 0:o.value)=="string")return o.value}function A(o,p,e){var a,m,n;let s=o==null?void 0:o.parameters,l=Y((a=o.slots)==null?void 0:a.pz);return u(q,{name:e,component:i=>{let t=P(i),r=u(p(i.type),t);return u(y,{composition:t.component},r)},variations:l,count:Number((n=(m=s==null?void 0:s.count)==null?void 0:m.value)!=null?n:1),key:e})}function b(o,p){var a,m,n,i;let e=(m=(a=o==null?void 0:o.slots)==null?void 0:a.test)!=null?m:[],s=((i=(n=o==null?void 0:o.parameters)==null?void 0:n.test)==null?void 0:i.value)||"Untitled Test",l=e.map((t,r)=>{var c,d;return{...t,id:(d=U((c=t.parameters)==null?void 0:c.testId))!=null?d:`variation-${r+1}-${t.type}`}});return u(F,{variations:l,name:s,key:p},{default:({variant:t})=>{let r=P(t);return u(t.type,r)}})}var G=j({name:v,inheritAttrs:!1,props:{slotName:{type:String,required:!0}},setup(o,p){let e=R("$__uniformData__"),s=R("$__uniformResolveRenderer__"),l=L(()=>x(e));if(o.slotName){let a=_(l.value,o.slotName);return()=>{var m;return(m=a==null?void 0:a.components.map((n,i)=>{let t=P(n),r=n.type,c=`${r}-${i}`,d=s(r),f=u(d,{...t,...p.attrs,key:c});return n.type===I&&(f=b(n,c)),n.type===D&&(f=A(n,s,c)),u(y,{composition:t.component},f)}))!=null?m:[]}}return()=>l.value.map((a,m)=>a==null?void 0:a.components.map((n,i)=>{let t=P(n),r=n.type,c=`${r}-${i}`,d=s(r),f=u(d,{...t,...p.attrs,key:c});return n.type===I&&(f=b(n,c)),n.type===D&&(f=A(n,s,c)),u(y,{composition:t.component},f)}))}});import{defineComponent as H,h as C}from"vue-demi";var J={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},X={margin:"0 0 1rem"},Z=H({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(o,{attrs:p}){var s;let e=(s=o.component)==null?void 0:s.type;return()=>C("div",{key:"content",style:{...J}},[C("h2",{style:{...X}},`Component: ${e}`),C("p",[C("strong",`${e} has no Vue implementation. It may need to be added to your `),C("code",{},"resolveRenderer()"),C("strong",{}," function.")]),C("details",{},[C("summary",{},"props/attributes"),C("pre",{style:{overflowX:"auto"}},`${JSON.stringify(p)}`)])])}});export{T as CANVAS_COMPOSITION_TYPE,v as CANVAS_SLOT_CONTENT_TYPE,y as Composition,Z as DefaultNotImplementedComponent,G as SlotContent,P as convertComponentToProps,_ as getDataForSlot,no as mapPzSlotToVariants,x as mapSlotsData,ro 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": "16.0.1-alpha.128+6cdb4ff33",
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,16 +23,21 @@
23
23
  "format": "prettier --write \"src/**/*.{js,ts,tsx}\""
24
24
  },
25
25
  "dependencies": {
26
- "@uniformdev/canvas": "^16.0.1-alpha.128+6cdb4ff33",
27
- "@uniformdev/context-vue": "^16.0.1-alpha.128+6cdb4ff33",
26
+ "@uniformdev/canvas": "^16.0.1-alpha.143+8bf270fcc",
27
+ "@uniformdev/context-vue": "^16.0.1-alpha.143+8bf270fcc",
28
28
  "@vue/test-utils": "1.3.0",
29
29
  "pascal-case": "3.1.2",
30
30
  "uuid": "8.3.2",
31
31
  "vue-demi": "^0.12.5"
32
32
  },
33
33
  "peerDependencies": {
34
- "@vue/composition-api": "^1.0.0-beta.12",
35
- "vue": ">=2.6"
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
+ }
36
41
  },
37
42
  "devDependencies": {
38
43
  "@testing-library/vue": "6.5.1",
@@ -59,5 +64,5 @@
59
64
  "last 2 versions",
60
65
  "not dead"
61
66
  ],
62
- "gitHead": "6cdb4ff331d6d0d9d5c154b7b342e7703067bfc3"
67
+ "gitHead": "8bf270fcc0cc82383d1f30311fe11dafd5fe3782"
63
68
  }