@uniformdev/canvas-vue 17.5.0 → 17.5.1-alpha.7

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as vue_demi from 'vue-demi';
 import { ConcreteComponent, PropType, Ref } from 'vue-demi';
-import { ComponentInstance, ComponentParameter, SubscribeToCompositionOptions } from '@uniformdev/canvas';
+import { ComponentInstance, ComponentParameter, SubscribeToCompositionOptions, UpdateCompositionMessage, RootComponentInstance } from '@uniformdev/canvas';
 
 interface TestComponent {
     slots?: {
@@ -63,7 +63,7 @@ declare const Composition: vue_demi.DefineComponent<{
     [key: string]: any;
 }>) | (() => vue_demi.VNode<vue_demi.RendererNode, vue_demi.RendererElement, {
     [key: string]: any;
-}>[] | undefined), unknown, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, Record<string, any>, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{
+}>[] | undefined), unknown, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{
     data: {
         type: PropType<ComponentInstance>;
         required: true;
@@ -92,7 +92,6 @@ declare type SlotComponentProps = {
 };
 /**
  * Renders the content of a Canvas composition's slot
- * @vue-prop {String} name - name of the Uniform Canvas slot you wish to scope to
  */
 declare const SlotContent: vue_demi.DefineComponent<{
     name: {
@@ -103,7 +102,7 @@ declare const SlotContent: vue_demi.DefineComponent<{
     };
 }, () => (ConcreteComponent<any, any, any, vue_demi.ComputedOptions, vue_demi.MethodOptions> | vue_demi.VNode<vue_demi.RendererNode, vue_demi.RendererElement, {
     [key: string]: any;
-}>[])[], unknown, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, Record<string, any>, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{
+}>[])[], unknown, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{
     name: {
         type: PropType<string | undefined>;
     };
@@ -122,7 +121,7 @@ declare const DefaultNotImplementedComponent: vue_demi.DefineComponent<{
     };
 }, () => vue_demi.VNode<vue_demi.RendererNode, vue_demi.RendererElement, {
     [key: string]: any;
-}>, unknown, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, Record<string, any>, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{
+}>, unknown, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{
     component: {
         type: PropType<ComponentInstance>;
         required: true;
@@ -145,6 +144,150 @@ declare type UseCompositionEventEffectOptions = Omit<Partial<SubscribeToComposit
 /** A composable to manage a subscription to a realtime event on a composition */
 declare function useCompositionEventEffect({ enabled, projectId, compositionIdRef, effect, }: UseCompositionEventEffectOptions): Promise<void>;
 
+declare const createApiEnhancer: ({ apiUrl }: {
+    apiUrl: string;
+}) => (message: UpdateCompositionMessage) => Promise<{
+    type: string;
+    parameters?: {
+        [key: string]: {
+            value: unknown;
+            type: string;
+            connectedData?: {
+                pointer: string;
+                syntax: "jptr";
+                required?: boolean | undefined;
+            } | undefined;
+        };
+    } | undefined;
+    variant?: string | undefined;
+    slots?: {
+        [key: string]: {
+            type: string;
+            parameters?: {
+                [key: string]: {
+                    value: unknown;
+                    type: string;
+                    connectedData?: {
+                        pointer: string;
+                        syntax: "jptr";
+                        required?: boolean | undefined;
+                    } | undefined;
+                };
+            } | undefined;
+            variant?: string | undefined;
+            slots?: {
+                [key: string]: any[];
+            } | undefined;
+            _id?: string | undefined;
+            _pattern?: string | undefined;
+            _dataResources?: {
+                [key: string]: {
+                    type: string;
+                    isPatternParameter?: boolean | undefined;
+                    variables?: {
+                        [key: string]: string;
+                    } | undefined;
+                };
+            } | undefined;
+            _patternDataResources?: {
+                [key: string]: {
+                    type: string;
+                    isPatternParameter?: boolean | undefined;
+                    variables?: {
+                        [key: string]: string;
+                    } | undefined;
+                };
+            } | undefined;
+            _patternError?: "NOTFOUND" | "CYCLIC" | undefined;
+        }[];
+    } | undefined;
+    _id: string;
+    _slug?: string | null | undefined;
+    _name: string;
+    _dataResources?: {
+        [key: string]: {
+            type: string;
+            isPatternParameter?: boolean | undefined;
+            variables?: {
+                [key: string]: string;
+            } | undefined;
+        };
+    } | undefined;
+}>;
+declare const useCompositionInstance: ({ composition, enhance, }: {
+    composition: RootComponentInstance;
+    enhance?: ((composition: UpdateCompositionMessage) => RootComponentInstance | Promise<RootComponentInstance>) | undefined;
+}) => {
+    composition: vue_demi.Ref<{
+        type: string;
+        parameters?: {
+            [key: string]: {
+                value: unknown;
+                type: string;
+                connectedData?: {
+                    pointer: string;
+                    syntax: "jptr";
+                    required?: boolean | undefined;
+                } | undefined;
+            };
+        } | undefined;
+        variant?: string | undefined;
+        slots?: {
+            [key: string]: {
+                type: string;
+                parameters?: {
+                    [key: string]: {
+                        value: unknown;
+                        type: string;
+                        connectedData?: {
+                            pointer: string;
+                            syntax: "jptr";
+                            required?: boolean | undefined;
+                        } | undefined;
+                    };
+                } | undefined;
+                variant?: string | undefined;
+                slots?: {
+                    [key: string]: any[];
+                } | undefined;
+                _id?: string | undefined;
+                _pattern?: string | undefined;
+                _dataResources?: {
+                    [key: string]: {
+                        type: string;
+                        isPatternParameter?: boolean | undefined;
+                        variables?: {
+                            [key: string]: string;
+                        } | undefined;
+                    };
+                } | undefined;
+                _patternDataResources?: {
+                    [key: string]: {
+                        type: string;
+                        isPatternParameter?: boolean | undefined;
+                        variables?: {
+                            [key: string]: string;
+                        } | undefined;
+                    };
+                } | undefined;
+                _patternError?: "NOTFOUND" | "CYCLIC" | undefined;
+            }[];
+        } | undefined;
+        _id: string;
+        _slug?: string | null | undefined;
+        _name: string;
+        _dataResources?: {
+            [key: string]: {
+                type: string;
+                isPatternParameter?: boolean | undefined;
+                variables?: {
+                    [key: string]: string;
+                } | undefined;
+            };
+        } | undefined;
+    }>;
+};
+
 /** Public ID of Canvas composition component type */
 declare const CANVAS_COMPOSITION_TYPE = "Composition";
 /** Public ID of Canvas slot component component type */
@@ -152,4 +295,4 @@ declare const CANVAS_SLOT_CONTENT_TYPE = "SlotContent";
 declare const compositionInjectionKey = "uniformComposition";
 declare const resolveRendererInjectionKey = "uniformResolveRenderer";
 
-export { CANVAS_COMPOSITION_TYPE, CANVAS_SLOT_CONTENT_TYPE, ComponentProps, Composition, CompositionProps, DefaultNotImplementedComponent, DefaultNotImplementedComponentProps, PersonalizeComponent, ResolveRenderer, SlotComponentProps, SlotContent, TestComponent, UseCompositionEventEffectOptions, compositionInjectionKey, convertComponentToProps, resolveRendererInjectionKey, useCompositionEventEffect };
+export { CANVAS_COMPOSITION_TYPE, CANVAS_SLOT_CONTENT_TYPE, ComponentProps, Composition, CompositionProps, DefaultNotImplementedComponent, DefaultNotImplementedComponentProps, PersonalizeComponent, ResolveRenderer, SlotComponentProps, SlotContent, TestComponent, UseCompositionEventEffectOptions, compositionInjectionKey, convertComponentToProps, createApiEnhancer, resolveRendererInjectionKey, useCompositionEventEffect, useCompositionInstance };

package/dist/index.esm.js

@@ -1 +1 @@
-import{defineComponent as x,computed as T,h as A,provide as b,inject as I,resolveComponent as g}from"vue-demi";var R="Composition",S="SlotContent",f="uniformComposition",C="uniformResolveRenderer";import{CANVAS_ENRICHMENT_TAG_PARAM as O}from"@uniformdev/canvas";import{Track as _,TrackSlot as k,isUsingUniformContext as w}from"@uniformdev/context-vue";var E=x({name:R,inheritAttrs:!1,props:{data:{type:Object,required:!0},resolveRenderer:{type:Function,default:()=>({type:e})=>g(e)},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var l,d,y;let o=T(()=>{var i,c;return(c=e.data)!=null?c:(i=I(f))==null?void 0:i.value}),n=(l=e.resolveRenderer)!=null?l:I(C);b(f,o),b(C,n);let s=T(()=>{var i,c;return(c=(i=o.value)==null?void 0:i.slots)!=null?c:{}}),p=T(()=>{var i,c;return(c=(i=o.value)==null?void 0:i.parameters)!=null?c:{}}),m=T(()=>JSON.stringify(o.value)),r=(y=(d=o.value.parameters)==null?void 0:d[O])==null?void 0:y.value,a=()=>{var i,c;return(c=(i=t.slots).default)==null?void 0:c.call(i,{slots:s.value,parameters:p.value})};if(w()){let i=e.behaviorTracking==="onLoad"?k:_;return()=>A(i,{behavior:r,key:m.value},a)}return a}});import{defineComponent as j,computed as z,h as v,inject as N}from"vue-demi";import{CANVAS_PERSONALIZE_TYPE as U,CANVAS_TEST_TYPE as K,mapSlotToPersonalizedVariations as L,mapSlotToTestVariations as Y}from"@uniformdev/canvas";import{Personalize as $,Test as D}from"@uniformdev/context-vue";function h(e){var s;let t=(s=e.parameters)!=null?s:{};return{...Object.entries(t).reduce((p,[m,{value:r}])=>({...p,[V(m)]:r}),{}),...e.data,component:e}}function V(e){return e.replace("$","")}var de=j({name:S,inheritAttrs:!1,props:{name:{type:String},resolveRenderer:{type:Function}},setup(e,t){var m;let o=N(f),n=(m=e.resolveRenderer)!=null?m:N(C);if(!o||!n)throw new Error("<SlotContent /> can only be used inside a <Composition />");let p=z(()=>{var r,a,l;return e.name?(a=(r=o==null?void 0:o.value.slots)==null?void 0:r[e.name])!=null?a:[]:Object.values((l=o==null?void 0:o.value.slots)!=null?l:{}).flat()}).value.map(r=>{let a=P({component:r,resolveRenderer:n});return t.slots.default?t.slots.default({child:a,component:r}):a});return()=>p}});function M(e,t){var p,m,r,a,l,d;let o=e==null?void 0:e.parameters,n=L((p=e.slots)==null?void 0:p.pz),s=(a=(r=(m=e.parameters)==null?void 0:m.trackingEventName)==null?void 0:r.value)!=null?a:"Untitled Personalization";return v($,{name:s,component:y=>t(y),variations:n,count:Number((d=(l=o==null?void 0:o.count)==null?void 0:l.value)!=null?d:1)})}function F(e,t){var p,m,r,a,l;let o=(m=(p=e==null?void 0:e.slots)==null?void 0:p.test)!=null?m:[],n=(l=(a=(r=e==null?void 0:e.parameters)==null?void 0:r.test)==null?void 0:a.value)!=null?l:"Untitled Test",s=Y(o);return v(D,{variations:s,name:n,component:d=>t(d)})}function P({component:e,resolveRenderer:t}){if(e.type===K)return F(e,n=>P({component:n,resolveRenderer:t}));if(e.type===U)return M(e,n=>P({component:n,resolveRenderer:t}));let o=t==null?void 0:t(e);if(o){let n=h(e);return v(E,{data:e,resolveRenderer:t},()=>v(o,n))}return console.warn(`[canvas] found component of type '${e.type}' which the 'resolveRenderer' prop returned no component for. Nothing will be rendered. The resolveRenderer function may need to be extended to handle the new type.`,e),v("")}import{defineComponent as q,h as u}from"vue-demi";var B={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},J={margin:"0 0 1rem"},ve=q({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()=>u("div",{key:"content",style:{...B}},[u("h2",{style:{...J}},`Component: ${o}`),u("p",[u("strong",`${o} has no Vue implementation. It may need to be added to your `),u("code",{},"resolveRenderer()"),u("strong",{}," function.")]),u("details",{},[u("summary",{},"props/attributes"),u("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});import{CANVAS_DRAFT_STATE as G,createEventBus as H,subscribeToComposition as X}from"@uniformdev/canvas";import{watch as Z}from"vue-demi";async function Q({enabled:e,projectId:t,compositionIdRef:o,effect:n}){let s;Z([()=>e,()=>o.value,()=>t],async()=>{if(s==null||s(),!e||!o.value||!t)return;let p=await H();p&&(s=X({eventBus:p,compositionId:o.value,compositionState:G,projectId:t,callback:n,event:"updated"}))},{immediate:!0})}export{R as CANVAS_COMPOSITION_TYPE,S as CANVAS_SLOT_CONTENT_TYPE,E as Composition,ve as DefaultNotImplementedComponent,de as SlotContent,f as compositionInjectionKey,h as convertComponentToProps,C as resolveRendererInjectionKey,Q as useCompositionEventEffect};
+import{defineComponent as _,computed as T,h as O,provide as I,inject as S,resolveComponent as A}from"vue-demi";var h="Composition",P="SlotContent",y="uniformComposition",v="uniformResolveRenderer";import{CANVAS_ENRICHMENT_TAG_PARAM as k}from"@uniformdev/canvas";import{Track as U,TrackSlot as V,isUsingUniformContext as j}from"@uniformdev/context-vue";var b=_({name:h,inheritAttrs:!1,props:{data:{type:Object,required:!0},resolveRenderer:{type:Function,default:()=>({type:e})=>A(e)},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var c,i,C;let o=T(()=>{var l,d;return(d=e.data)!=null?d:(l=S(y))==null?void 0:l.value}),s=(c=e.resolveRenderer)!=null?c:S(v);I(y,o),I(v,s);let r=T(()=>{var l,d;return(d=(l=o.value)==null?void 0:l.slots)!=null?d:{}}),n=T(()=>{var l,d;return(d=(l=o.value)==null?void 0:l.parameters)!=null?d:{}}),p=T(()=>JSON.stringify(o.value)),m=(C=(i=o.value.parameters)==null?void 0:i[k])==null?void 0:C.value,a=()=>{var l,d;return(d=(l=t.slots).default)==null?void 0:d.call(l,{slots:r.value,parameters:n.value})};if(j()){let l=e.behaviorTracking==="onLoad"?V:U;return()=>O(l,{behavior:m,key:p.value},a)}return a}});import{defineComponent as L,computed as z,h as f,inject as w}from"vue-demi";import{CANVAS_PERSONALIZE_TYPE as D,CANVAS_TEST_TYPE as K,IN_CONTEXT_EDITOR_COMPONENT_START_ROLE as Y,mapSlotToPersonalizedVariations as B,mapSlotToTestVariations as $,PLACEHOLDER_ID as F}from"@uniformdev/canvas";import{Personalize as J,Test as X}from"@uniformdev/context-vue";function E(e){var r;let t=(r=e.parameters)!=null?r:{};return{...Object.entries(t).reduce((n,[p,{value:m}])=>({...n,[M(p)]:m}),{}),...e.data,component:e}}function M(e){return e.replace("$","")}var be=L({name:P,inheritAttrs:!1,props:{name:{type:String},resolveRenderer:{type:Function}},setup(e,t){var m;let o=w(y),s=(m=e.resolveRenderer)!=null?m:w(v),r=t.slots.emptyPlaceholder;if(!o||!s)throw new Error("<SlotContent /> can only be used inside a <Composition />");let n=z(()=>{var a,c,i;return e.name?(c=(a=o==null?void 0:o.value.slots)==null?void 0:a[e.name])!=null?c:[]:Object.values((i=o==null?void 0:o.value.slots)!=null?i:{}).flat()}),p=n.value.map((a,c)=>{let i=R({component:a,resolveRenderer:s,indexInSlot:c,slotName:e.name,parentComponent:o.value,slotChildrenCount:n.value.length,emptyPlaceholder:r});return t.slots.default?t.slots.default({child:i,component:a}):i});return()=>p}});function q(e,t){var n,p,m,a,c,i;let o=e==null?void 0:e.parameters,s=B((n=e.slots)==null?void 0:n.pz),r=(a=(m=(p=e.parameters)==null?void 0:p.trackingEventName)==null?void 0:m.value)!=null?a:"Untitled Personalization";return f(J,{name:r,component:C=>t(C),variations:s,count:Number((i=(c=o==null?void 0:o.count)==null?void 0:c.value)!=null?i:1)})}function G(e,t){var n,p,m,a,c;let o=(p=(n=e==null?void 0:e.slots)==null?void 0:n.test)!=null?p:[],s=(c=(a=(m=e==null?void 0:e.parameters)==null?void 0:m.test)==null?void 0:a.value)!=null?c:"Untitled Test",r=$(o);return f(X,{variations:r,name:s,component:i=>t(i)})}function R({component:e,resolveRenderer:t,indexInSlot:o,slotName:s,parentComponent:r,slotChildrenCount:n,emptyPlaceholder:p}){var a,c;if(e.type===K)return G(e,i=>R({component:i,resolveRenderer:t}));if(e.type===D)return q(e,i=>R({component:i,resolveRenderer:t}));let m=t==null?void 0:t(e);if(m){let i=E(e),C=Boolean(e._id),l=e._id===F,d=C?[f("script",{"data-role":Y,"data-parent-type":r==null?void 0:r.type,"data-component-id":e._id,"data-slot-name":s,"data-component-index":o,"data-total-components":n,"data-component-name":e.type,"data-is-placeholder":l?"true":void 0,"data-component-title":(c=(a=e.parameters)==null?void 0:a.title)==null?void 0:c.value}),l&&p!==void 0?p():f(m,i),f("script",{"data-role":"component-end"})]:[f(m,i)];return f(b,{data:e,resolveRenderer:t},()=>d)}return console.warn(`[canvas] found component of type '${e.type}' which the 'resolveRenderer' prop returned no component for. Nothing will be rendered. The resolveRenderer function may need to be extended to handle the new type.`,e),f("")}import{defineComponent as H,h as u}from"vue-demi";var Q={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},Z={margin:"0 0 1rem"},xe=H({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(e,{attrs:t}){var s;let o=(s=e.component)==null?void 0:s.type;return()=>u("div",{key:"content",style:{...Q}},[u("h2",{style:{...Z}},`Component: ${o}`),u("p",[u("strong",`${o} has no Vue implementation. It may need to be added to your `),u("code",{},"resolveRenderer()"),u("strong",{}," function.")]),u("details",{},[u("summary",{},"props/attributes"),u("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});import{CANVAS_DRAFT_STATE as W,createEventBus as ee,subscribeToComposition as oe}from"@uniformdev/canvas";import{watch as te}from"vue-demi";async function Oe({enabled:e,projectId:t,compositionIdRef:o,effect:s}){let r;te([()=>e,()=>o.value,()=>t],async()=>{if(r==null||r(),!e||!o.value||!t)return;let n=await ee();n&&(r=oe({eventBus:n,compositionId:o.value,compositionState:W,projectId:t,callback:s,event:"updated"}))},{immediate:!0})}import{createCanvasChannel as ne,isUpdateCompositionMessage as re,IN_CONTEXT_EDITOR_QUERY_STRING_PARAM as se}from"@uniformdev/canvas";import{ref as ie,computed as ae,watch as x,onMounted as pe}from"vue-demi";var g="uniform-canvas-preview-script",Me=({apiUrl:e})=>async t=>{let o=await fetch(e,{method:"post",body:JSON.stringify({composition:t.composition,hash:t.hash}),headers:{"Content-Type":"application/json"}}),s=await o.json();if(!o.ok)throw new Error("Error reading enhanced composition");return s.composition},Le=({composition:e,enhance:t=o=>o.composition})=>{let o=ie(e);x([()=>e,o],()=>{e._id!==o.value._id&&(o.value=e)},{immediate:!0});let s=ae(()=>{var n;return N()?ne({broadcastTo:[(n=window.opener)!=null?n:window.top],listenTo:[window]}):void 0});return x([s,()=>t],()=>{if(!s.value)return;let r=s.value.on("update-composition",async n=>{if(re(n)){let p=await t(n);o.value=p}});return()=>{r()}},{immediate:!0}),pe(()=>{if(!N()||document.getElementById(g))return;let n=document.createElement("script");n.id=g,n.src=me(),n.async=!0,document.head.appendChild(n)}),{composition:o}};function me(){return`${window.document.referrer}files/canvas-in-context-embed/index.js`}function N(){if(typeof window=="undefined")return!1;let e=new URLSearchParams(window.location.search).has(se),t=Boolean(window.document.referrer.match(/(^https:\/\/|\.)(uniform.app|uniform.wtf|localhost:\d{4})\//));return e&&t}export{h as CANVAS_COMPOSITION_TYPE,P as CANVAS_SLOT_CONTENT_TYPE,b as Composition,xe as DefaultNotImplementedComponent,be as SlotContent,y as compositionInjectionKey,E as convertComponentToProps,Me as createApiEnhancer,v as resolveRendererInjectionKey,Oe as useCompositionEventEffect,Le as useCompositionInstance};

package/dist/index.js

@@ -1 +1 @@
-"use strict";var I=Object.defineProperty;var k=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var V=Object.prototype.hasOwnProperty;var j=(e,t)=>{for(var o in t)I(e,o,{get:t[o],enumerable:!0})},z=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of w(t))!V.call(e,r)&&r!==o&&I(e,r,{get:()=>t[r],enumerable:!(n=k(t,r))||n.enumerable});return e};var U=e=>z(I({},"__esModule",{value:!0}),e);var q={};j(q,{CANVAS_COMPOSITION_TYPE:()=>E,CANVAS_SLOT_CONTENT_TYPE:()=>h,Composition:()=>N,DefaultNotImplementedComponent:()=>F,SlotContent:()=>L,compositionInjectionKey:()=>y,convertComponentToProps:()=>x,resolveRendererInjectionKey:()=>T,useCompositionEventEffect:()=>_});module.exports=U(q);var s=require("vue-demi");var E="Composition",h="SlotContent",y="uniformComposition",T="uniformResolveRenderer";var g=require("@uniformdev/canvas"),P=require("@uniformdev/context-vue");var N=(0,s.defineComponent)({name:E,inheritAttrs:!1,props:{data:{type:Object,required:!0},resolveRenderer:{type:Function,default:()=>({type:e})=>(0,s.resolveComponent)(e)},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var d,v,S;let o=(0,s.computed)(()=>{var m,f;return(f=e.data)!=null?f:(m=(0,s.inject)(y))==null?void 0:m.value}),n=(d=e.resolveRenderer)!=null?d:(0,s.inject)(T);(0,s.provide)(y,o),(0,s.provide)(T,n);let r=(0,s.computed)(()=>{var m,f;return(f=(m=o.value)==null?void 0:m.slots)!=null?f:{}}),a=(0,s.computed)(()=>{var m,f;return(f=(m=o.value)==null?void 0:m.parameters)!=null?f:{}}),c=(0,s.computed)(()=>JSON.stringify(o.value)),p=(S=(v=o.value.parameters)==null?void 0:v[g.CANVAS_ENRICHMENT_TAG_PARAM])==null?void 0:S.value,i=()=>{var m,f;return(f=(m=t.slots).default)==null?void 0:f.call(m,{slots:r.value,parameters:a.value})};if((0,P.isUsingUniformContext)()){let m=e.behaviorTracking==="onLoad"?P.TrackSlot:P.Track;return()=>(0,s.h)(m,{behavior:p,key:c.value},i)}return i}});var l=require("vue-demi"),C=require("@uniformdev/canvas"),b=require("@uniformdev/context-vue");function x(e){var r;let t=(r=e.parameters)!=null?r:{};return{...Object.entries(t).reduce((a,[c,{value:p}])=>({...a,[K(c)]:p}),{}),...e.data,component:e}}function K(e){return e.replace("$","")}var L=(0,l.defineComponent)({name:h,inheritAttrs:!1,props:{name:{type:String},resolveRenderer:{type:Function}},setup(e,t){var c;let o=(0,l.inject)(y),n=(c=e.resolveRenderer)!=null?c:(0,l.inject)(T);if(!o||!n)throw new Error("<SlotContent /> can only be used inside a <Composition />");let a=(0,l.computed)(()=>{var p,i,d;return e.name?(i=(p=o==null?void 0:o.value.slots)==null?void 0:p[e.name])!=null?i:[]:Object.values((d=o==null?void 0:o.value.slots)!=null?d:{}).flat()}).value.map(p=>{let i=A({component:p,resolveRenderer:n});return t.slots.default?t.slots.default({child:i,component:p}):i});return()=>a}});function Y(e,t){var a,c,p,i,d,v;let o=e==null?void 0:e.parameters,n=(0,C.mapSlotToPersonalizedVariations)((a=e.slots)==null?void 0:a.pz),r=(i=(p=(c=e.parameters)==null?void 0:c.trackingEventName)==null?void 0:p.value)!=null?i:"Untitled Personalization";return(0,l.h)(b.Personalize,{name:r,component:S=>t(S),variations:n,count:Number((v=(d=o==null?void 0:o.count)==null?void 0:d.value)!=null?v:1)})}function $(e,t){var a,c,p,i,d;let o=(c=(a=e==null?void 0:e.slots)==null?void 0:a.test)!=null?c:[],n=(d=(i=(p=e==null?void 0:e.parameters)==null?void 0:p.test)==null?void 0:i.value)!=null?d:"Untitled Test",r=(0,C.mapSlotToTestVariations)(o);return(0,l.h)(b.Test,{variations:r,name:n,component:v=>t(v)})}function A({component:e,resolveRenderer:t}){if(e.type===C.CANVAS_TEST_TYPE)return $(e,n=>A({component:n,resolveRenderer:t}));if(e.type===C.CANVAS_PERSONALIZE_TYPE)return Y(e,n=>A({component:n,resolveRenderer:t}));let o=t==null?void 0:t(e);if(o){let n=x(e);return(0,l.h)(N,{data:e,resolveRenderer:t},()=>(0,l.h)(o,n))}return console.warn(`[canvas] found component of type '${e.type}' which the 'resolveRenderer' prop returned no component for. Nothing will be rendered. The resolveRenderer function may need to be extended to handle the new type.`,e),(0,l.h)("")}var u=require("vue-demi"),D={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},M={margin:"0 0 1rem"},F=(0,u.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,u.h)("div",{key:"content",style:{...D}},[(0,u.h)("h2",{style:{...M}},`Component: ${o}`),(0,u.h)("p",[(0,u.h)("strong",`${o} has no Vue implementation. It may need to be added to your `),(0,u.h)("code",{},"resolveRenderer()"),(0,u.h)("strong",{}," function.")]),(0,u.h)("details",{},[(0,u.h)("summary",{},"props/attributes"),(0,u.h)("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});var R=require("@uniformdev/canvas"),O=require("vue-demi");async function _({enabled:e,projectId:t,compositionIdRef:o,effect:n}){let r;(0,O.watch)([()=>e,()=>o.value,()=>t],async()=>{if(r==null||r(),!e||!o.value||!t)return;let a=await(0,R.createEventBus)();a&&(r=(0,R.subscribeToComposition)({eventBus:a,compositionId:o.value,compositionState:R.CANVAS_DRAFT_STATE,projectId:t,callback:n,event:"updated"}))},{immediate:!0})}0&&(module.exports={CANVAS_COMPOSITION_TYPE,CANVAS_SLOT_CONTENT_TYPE,Composition,DefaultNotImplementedComponent,SlotContent,compositionInjectionKey,convertComponentToProps,resolveRendererInjectionKey,useCompositionEventEffect});
+"use strict";var E=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var M=Object.prototype.hasOwnProperty;var L=(e,t)=>{for(var o in t)E(e,o,{get:t[o],enumerable:!0})},z=(e,t,o,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of j(t))!M.call(e,n)&&n!==o&&E(e,n,{get:()=>t[n],enumerable:!(s=V(t,n))||s.enumerable});return e};var D=e=>z(E({},"__esModule",{value:!0}),e);var Z={};L(Z,{CANVAS_COMPOSITION_TYPE:()=>w,CANVAS_SLOT_CONTENT_TYPE:()=>x,Composition:()=>g,DefaultNotImplementedComponent:()=>X,SlotContent:()=>Y,compositionInjectionKey:()=>R,convertComponentToProps:()=>N,createApiEnhancer:()=>G,resolveRendererInjectionKey:()=>h,useCompositionEventEffect:()=>q,useCompositionInstance:()=>H});module.exports=D(Z);var p=require("vue-demi");var w="Composition",x="SlotContent",R="uniformComposition",h="uniformResolveRenderer";var O=require("@uniformdev/canvas"),P=require("@uniformdev/context-vue");var g=(0,p.defineComponent)({name:w,inheritAttrs:!1,props:{data:{type:Object,required:!0},resolveRenderer:{type:Function,default:()=>({type:e})=>(0,p.resolveComponent)(e)},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var l,i,T;let o=(0,p.computed)(()=>{var d,f;return(f=e.data)!=null?f:(d=(0,p.inject)(R))==null?void 0:d.value}),s=(l=e.resolveRenderer)!=null?l:(0,p.inject)(h);(0,p.provide)(R,o),(0,p.provide)(h,s);let n=(0,p.computed)(()=>{var d,f;return(f=(d=o.value)==null?void 0:d.slots)!=null?f:{}}),r=(0,p.computed)(()=>{var d,f;return(f=(d=o.value)==null?void 0:d.parameters)!=null?f:{}}),m=(0,p.computed)(()=>JSON.stringify(o.value)),c=(T=(i=o.value.parameters)==null?void 0:i[O.CANVAS_ENRICHMENT_TAG_PARAM])==null?void 0:T.value,a=()=>{var d,f;return(f=(d=t.slots).default)==null?void 0:f.call(d,{slots:n.value,parameters:r.value})};if((0,P.isUsingUniformContext)()){let d=e.behaviorTracking==="onLoad"?P.TrackSlot:P.Track;return()=>(0,p.h)(d,{behavior:c,key:m.value},a)}return a}});var u=require("vue-demi"),C=require("@uniformdev/canvas"),b=require("@uniformdev/context-vue");function N(e){var n;let t=(n=e.parameters)!=null?n:{};return{...Object.entries(t).reduce((r,[m,{value:c}])=>({...r,[K(m)]:c}),{}),...e.data,component:e}}function K(e){return e.replace("$","")}var Y=(0,u.defineComponent)({name:x,inheritAttrs:!1,props:{name:{type:String},resolveRenderer:{type:Function}},setup(e,t){var c;let o=(0,u.inject)(R),s=(c=e.resolveRenderer)!=null?c:(0,u.inject)(h),n=t.slots.emptyPlaceholder;if(!o||!s)throw new Error("<SlotContent /> can only be used inside a <Composition />");let r=(0,u.computed)(()=>{var a,l,i;return e.name?(l=(a=o==null?void 0:o.value.slots)==null?void 0:a[e.name])!=null?l:[]:Object.values((i=o==null?void 0:o.value.slots)!=null?i:{}).flat()}),m=r.value.map((a,l)=>{let i=_({component:a,resolveRenderer:s,indexInSlot:l,slotName:e.name,parentComponent:o.value,slotChildrenCount:r.value.length,emptyPlaceholder:n});return t.slots.default?t.slots.default({child:i,component:a}):i});return()=>m}});function B(e,t){var r,m,c,a,l,i;let o=e==null?void 0:e.parameters,s=(0,C.mapSlotToPersonalizedVariations)((r=e.slots)==null?void 0:r.pz),n=(a=(c=(m=e.parameters)==null?void 0:m.trackingEventName)==null?void 0:c.value)!=null?a:"Untitled Personalization";return(0,u.h)(b.Personalize,{name:n,component:T=>t(T),variations:s,count:Number((i=(l=o==null?void 0:o.count)==null?void 0:l.value)!=null?i:1)})}function $(e,t){var r,m,c,a,l;let o=(m=(r=e==null?void 0:e.slots)==null?void 0:r.test)!=null?m:[],s=(l=(a=(c=e==null?void 0:e.parameters)==null?void 0:c.test)==null?void 0:a.value)!=null?l:"Untitled Test",n=(0,C.mapSlotToTestVariations)(o);return(0,u.h)(b.Test,{variations:n,name:s,component:i=>t(i)})}function _({component:e,resolveRenderer:t,indexInSlot:o,slotName:s,parentComponent:n,slotChildrenCount:r,emptyPlaceholder:m}){var a,l;if(e.type===C.CANVAS_TEST_TYPE)return $(e,i=>_({component:i,resolveRenderer:t}));if(e.type===C.CANVAS_PERSONALIZE_TYPE)return B(e,i=>_({component:i,resolveRenderer:t}));let c=t==null?void 0:t(e);if(c){let i=N(e),T=Boolean(e._id),d=e._id===C.PLACEHOLDER_ID,f=T?[(0,u.h)("script",{"data-role":C.IN_CONTEXT_EDITOR_COMPONENT_START_ROLE,"data-parent-type":n==null?void 0:n.type,"data-component-id":e._id,"data-slot-name":s,"data-component-index":o,"data-total-components":r,"data-component-name":e.type,"data-is-placeholder":d?"true":void 0,"data-component-title":(l=(a=e.parameters)==null?void 0:a.title)==null?void 0:l.value}),d&&m!==void 0?m():(0,u.h)(c,i),(0,u.h)("script",{"data-role":"component-end"})]:[(0,u.h)(c,i)];return(0,u.h)(g,{data:e,resolveRenderer:t},()=>f)}return console.warn(`[canvas] found component of type '${e.type}' which the 'resolveRenderer' prop returned no component for. Nothing will be rendered. The resolveRenderer function may need to be extended to handle the new type.`,e),(0,u.h)("")}var y=require("vue-demi"),F={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},J={margin:"0 0 1rem"},X=(0,y.defineComponent)({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(e,{attrs:t}){var s;let o=(s=e.component)==null?void 0:s.type;return()=>(0,y.h)("div",{key:"content",style:{...F}},[(0,y.h)("h2",{style:{...J}},`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 I=require("@uniformdev/canvas"),A=require("vue-demi");async function q({enabled:e,projectId:t,compositionIdRef:o,effect:s}){let n;(0,A.watch)([()=>e,()=>o.value,()=>t],async()=>{if(n==null||n(),!e||!o.value||!t)return;let r=await(0,I.createEventBus)();r&&(n=(0,I.subscribeToComposition)({eventBus:r,compositionId:o.value,compositionState:I.CANVAS_DRAFT_STATE,projectId:t,callback:s,event:"updated"}))},{immediate:!0})}var S=require("@uniformdev/canvas"),v=require("vue-demi"),k="uniform-canvas-preview-script",G=({apiUrl:e})=>async t=>{let o=await fetch(e,{method:"post",body:JSON.stringify({composition:t.composition,hash:t.hash}),headers:{"Content-Type":"application/json"}}),s=await o.json();if(!o.ok)throw new Error("Error reading enhanced composition");return s.composition},H=({composition:e,enhance:t=o=>o.composition})=>{let o=(0,v.ref)(e);(0,v.watch)([()=>e,o],()=>{e._id!==o.value._id&&(o.value=e)},{immediate:!0});let s=(0,v.computed)(()=>{var r;return U()?(0,S.createCanvasChannel)({broadcastTo:[(r=window.opener)!=null?r:window.top],listenTo:[window]}):void 0});return(0,v.watch)([s,()=>t],()=>{if(!s.value)return;let n=s.value.on("update-composition",async r=>{if((0,S.isUpdateCompositionMessage)(r)){let m=await t(r);o.value=m}});return()=>{n()}},{immediate:!0}),(0,v.onMounted)(()=>{if(!U()||document.getElementById(k))return;let r=document.createElement("script");r.id=k,r.src=Q(),r.async=!0,document.head.appendChild(r)}),{composition:o}};function Q(){return`${window.document.referrer}files/canvas-in-context-embed/index.js`}function U(){if(typeof window=="undefined")return!1;let e=new URLSearchParams(window.location.search).has(S.IN_CONTEXT_EDITOR_QUERY_STRING_PARAM),t=Boolean(window.document.referrer.match(/(^https:\/\/|\.)(uniform.app|uniform.wtf|localhost:\d{4})\//));return e&&t}0&&(module.exports={CANVAS_COMPOSITION_TYPE,CANVAS_SLOT_CONTENT_TYPE,Composition,DefaultNotImplementedComponent,SlotContent,compositionInjectionKey,convertComponentToProps,createApiEnhancer,resolveRendererInjectionKey,useCompositionEventEffect,useCompositionInstance});

package/dist/index.mjs

@@ -1 +1 @@
-import{defineComponent as x,computed as T,h as A,provide as b,inject as I,resolveComponent as g}from"vue-demi";var R="Composition",S="SlotContent",f="uniformComposition",C="uniformResolveRenderer";import{CANVAS_ENRICHMENT_TAG_PARAM as O}from"@uniformdev/canvas";import{Track as _,TrackSlot as k,isUsingUniformContext as w}from"@uniformdev/context-vue";var E=x({name:R,inheritAttrs:!1,props:{data:{type:Object,required:!0},resolveRenderer:{type:Function,default:()=>({type:e})=>g(e)},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var l,d,y;let o=T(()=>{var i,c;return(c=e.data)!=null?c:(i=I(f))==null?void 0:i.value}),n=(l=e.resolveRenderer)!=null?l:I(C);b(f,o),b(C,n);let s=T(()=>{var i,c;return(c=(i=o.value)==null?void 0:i.slots)!=null?c:{}}),p=T(()=>{var i,c;return(c=(i=o.value)==null?void 0:i.parameters)!=null?c:{}}),m=T(()=>JSON.stringify(o.value)),r=(y=(d=o.value.parameters)==null?void 0:d[O])==null?void 0:y.value,a=()=>{var i,c;return(c=(i=t.slots).default)==null?void 0:c.call(i,{slots:s.value,parameters:p.value})};if(w()){let i=e.behaviorTracking==="onLoad"?k:_;return()=>A(i,{behavior:r,key:m.value},a)}return a}});import{defineComponent as j,computed as z,h as v,inject as N}from"vue-demi";import{CANVAS_PERSONALIZE_TYPE as U,CANVAS_TEST_TYPE as K,mapSlotToPersonalizedVariations as L,mapSlotToTestVariations as Y}from"@uniformdev/canvas";import{Personalize as $,Test as D}from"@uniformdev/context-vue";function h(e){var s;let t=(s=e.parameters)!=null?s:{};return{...Object.entries(t).reduce((p,[m,{value:r}])=>({...p,[V(m)]:r}),{}),...e.data,component:e}}function V(e){return e.replace("$","")}var de=j({name:S,inheritAttrs:!1,props:{name:{type:String},resolveRenderer:{type:Function}},setup(e,t){var m;let o=N(f),n=(m=e.resolveRenderer)!=null?m:N(C);if(!o||!n)throw new Error("<SlotContent /> can only be used inside a <Composition />");let p=z(()=>{var r,a,l;return e.name?(a=(r=o==null?void 0:o.value.slots)==null?void 0:r[e.name])!=null?a:[]:Object.values((l=o==null?void 0:o.value.slots)!=null?l:{}).flat()}).value.map(r=>{let a=P({component:r,resolveRenderer:n});return t.slots.default?t.slots.default({child:a,component:r}):a});return()=>p}});function M(e,t){var p,m,r,a,l,d;let o=e==null?void 0:e.parameters,n=L((p=e.slots)==null?void 0:p.pz),s=(a=(r=(m=e.parameters)==null?void 0:m.trackingEventName)==null?void 0:r.value)!=null?a:"Untitled Personalization";return v($,{name:s,component:y=>t(y),variations:n,count:Number((d=(l=o==null?void 0:o.count)==null?void 0:l.value)!=null?d:1)})}function F(e,t){var p,m,r,a,l;let o=(m=(p=e==null?void 0:e.slots)==null?void 0:p.test)!=null?m:[],n=(l=(a=(r=e==null?void 0:e.parameters)==null?void 0:r.test)==null?void 0:a.value)!=null?l:"Untitled Test",s=Y(o);return v(D,{variations:s,name:n,component:d=>t(d)})}function P({component:e,resolveRenderer:t}){if(e.type===K)return F(e,n=>P({component:n,resolveRenderer:t}));if(e.type===U)return M(e,n=>P({component:n,resolveRenderer:t}));let o=t==null?void 0:t(e);if(o){let n=h(e);return v(E,{data:e,resolveRenderer:t},()=>v(o,n))}return console.warn(`[canvas] found component of type '${e.type}' which the 'resolveRenderer' prop returned no component for. Nothing will be rendered. The resolveRenderer function may need to be extended to handle the new type.`,e),v("")}import{defineComponent as q,h as u}from"vue-demi";var B={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},J={margin:"0 0 1rem"},ve=q({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()=>u("div",{key:"content",style:{...B}},[u("h2",{style:{...J}},`Component: ${o}`),u("p",[u("strong",`${o} has no Vue implementation. It may need to be added to your `),u("code",{},"resolveRenderer()"),u("strong",{}," function.")]),u("details",{},[u("summary",{},"props/attributes"),u("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});import{CANVAS_DRAFT_STATE as G,createEventBus as H,subscribeToComposition as X}from"@uniformdev/canvas";import{watch as Z}from"vue-demi";async function Q({enabled:e,projectId:t,compositionIdRef:o,effect:n}){let s;Z([()=>e,()=>o.value,()=>t],async()=>{if(s==null||s(),!e||!o.value||!t)return;let p=await H();p&&(s=X({eventBus:p,compositionId:o.value,compositionState:G,projectId:t,callback:n,event:"updated"}))},{immediate:!0})}export{R as CANVAS_COMPOSITION_TYPE,S as CANVAS_SLOT_CONTENT_TYPE,E as Composition,ve as DefaultNotImplementedComponent,de as SlotContent,f as compositionInjectionKey,h as convertComponentToProps,C as resolveRendererInjectionKey,Q as useCompositionEventEffect};
+import{defineComponent as _,computed as T,h as O,provide as I,inject as S,resolveComponent as A}from"vue-demi";var h="Composition",P="SlotContent",y="uniformComposition",v="uniformResolveRenderer";import{CANVAS_ENRICHMENT_TAG_PARAM as k}from"@uniformdev/canvas";import{Track as U,TrackSlot as V,isUsingUniformContext as j}from"@uniformdev/context-vue";var b=_({name:h,inheritAttrs:!1,props:{data:{type:Object,required:!0},resolveRenderer:{type:Function,default:()=>({type:e})=>A(e)},behaviorTracking:{type:String,default:"onView"}},setup(e,t){var c,i,C;let o=T(()=>{var l,d;return(d=e.data)!=null?d:(l=S(y))==null?void 0:l.value}),s=(c=e.resolveRenderer)!=null?c:S(v);I(y,o),I(v,s);let r=T(()=>{var l,d;return(d=(l=o.value)==null?void 0:l.slots)!=null?d:{}}),n=T(()=>{var l,d;return(d=(l=o.value)==null?void 0:l.parameters)!=null?d:{}}),p=T(()=>JSON.stringify(o.value)),m=(C=(i=o.value.parameters)==null?void 0:i[k])==null?void 0:C.value,a=()=>{var l,d;return(d=(l=t.slots).default)==null?void 0:d.call(l,{slots:r.value,parameters:n.value})};if(j()){let l=e.behaviorTracking==="onLoad"?V:U;return()=>O(l,{behavior:m,key:p.value},a)}return a}});import{defineComponent as L,computed as z,h as f,inject as w}from"vue-demi";import{CANVAS_PERSONALIZE_TYPE as D,CANVAS_TEST_TYPE as K,IN_CONTEXT_EDITOR_COMPONENT_START_ROLE as Y,mapSlotToPersonalizedVariations as B,mapSlotToTestVariations as $,PLACEHOLDER_ID as F}from"@uniformdev/canvas";import{Personalize as J,Test as X}from"@uniformdev/context-vue";function E(e){var r;let t=(r=e.parameters)!=null?r:{};return{...Object.entries(t).reduce((n,[p,{value:m}])=>({...n,[M(p)]:m}),{}),...e.data,component:e}}function M(e){return e.replace("$","")}var be=L({name:P,inheritAttrs:!1,props:{name:{type:String},resolveRenderer:{type:Function}},setup(e,t){var m;let o=w(y),s=(m=e.resolveRenderer)!=null?m:w(v),r=t.slots.emptyPlaceholder;if(!o||!s)throw new Error("<SlotContent /> can only be used inside a <Composition />");let n=z(()=>{var a,c,i;return e.name?(c=(a=o==null?void 0:o.value.slots)==null?void 0:a[e.name])!=null?c:[]:Object.values((i=o==null?void 0:o.value.slots)!=null?i:{}).flat()}),p=n.value.map((a,c)=>{let i=R({component:a,resolveRenderer:s,indexInSlot:c,slotName:e.name,parentComponent:o.value,slotChildrenCount:n.value.length,emptyPlaceholder:r});return t.slots.default?t.slots.default({child:i,component:a}):i});return()=>p}});function q(e,t){var n,p,m,a,c,i;let o=e==null?void 0:e.parameters,s=B((n=e.slots)==null?void 0:n.pz),r=(a=(m=(p=e.parameters)==null?void 0:p.trackingEventName)==null?void 0:m.value)!=null?a:"Untitled Personalization";return f(J,{name:r,component:C=>t(C),variations:s,count:Number((i=(c=o==null?void 0:o.count)==null?void 0:c.value)!=null?i:1)})}function G(e,t){var n,p,m,a,c;let o=(p=(n=e==null?void 0:e.slots)==null?void 0:n.test)!=null?p:[],s=(c=(a=(m=e==null?void 0:e.parameters)==null?void 0:m.test)==null?void 0:a.value)!=null?c:"Untitled Test",r=$(o);return f(X,{variations:r,name:s,component:i=>t(i)})}function R({component:e,resolveRenderer:t,indexInSlot:o,slotName:s,parentComponent:r,slotChildrenCount:n,emptyPlaceholder:p}){var a,c;if(e.type===K)return G(e,i=>R({component:i,resolveRenderer:t}));if(e.type===D)return q(e,i=>R({component:i,resolveRenderer:t}));let m=t==null?void 0:t(e);if(m){let i=E(e),C=Boolean(e._id),l=e._id===F,d=C?[f("script",{"data-role":Y,"data-parent-type":r==null?void 0:r.type,"data-component-id":e._id,"data-slot-name":s,"data-component-index":o,"data-total-components":n,"data-component-name":e.type,"data-is-placeholder":l?"true":void 0,"data-component-title":(c=(a=e.parameters)==null?void 0:a.title)==null?void 0:c.value}),l&&p!==void 0?p():f(m,i),f("script",{"data-role":"component-end"})]:[f(m,i)];return f(b,{data:e,resolveRenderer:t},()=>d)}return console.warn(`[canvas] found component of type '${e.type}' which the 'resolveRenderer' prop returned no component for. Nothing will be rendered. The resolveRenderer function may need to be extended to handle the new type.`,e),f("")}import{defineComponent as H,h as u}from"vue-demi";var Q={borderLeft:"10px solid #e42535",background:"rgba(122, 215, 218, 0.3)",color:"#1d3557",padding:"1rem",textAlign:"left",margin:"1rem 5vw"},Z={margin:"0 0 1rem"},xe=H({name:"DefaultNotImplementedComponent",props:{component:{type:Object,required:!0}},setup(e,{attrs:t}){var s;let o=(s=e.component)==null?void 0:s.type;return()=>u("div",{key:"content",style:{...Q}},[u("h2",{style:{...Z}},`Component: ${o}`),u("p",[u("strong",`${o} has no Vue implementation. It may need to be added to your `),u("code",{},"resolveRenderer()"),u("strong",{}," function.")]),u("details",{},[u("summary",{},"props/attributes"),u("pre",{style:{overflowX:"auto"}},`${JSON.stringify(t)}`)])])}});import{CANVAS_DRAFT_STATE as W,createEventBus as ee,subscribeToComposition as oe}from"@uniformdev/canvas";import{watch as te}from"vue-demi";async function Oe({enabled:e,projectId:t,compositionIdRef:o,effect:s}){let r;te([()=>e,()=>o.value,()=>t],async()=>{if(r==null||r(),!e||!o.value||!t)return;let n=await ee();n&&(r=oe({eventBus:n,compositionId:o.value,compositionState:W,projectId:t,callback:s,event:"updated"}))},{immediate:!0})}import{createCanvasChannel as ne,isUpdateCompositionMessage as re,IN_CONTEXT_EDITOR_QUERY_STRING_PARAM as se}from"@uniformdev/canvas";import{ref as ie,computed as ae,watch as x,onMounted as pe}from"vue-demi";var g="uniform-canvas-preview-script",Me=({apiUrl:e})=>async t=>{let o=await fetch(e,{method:"post",body:JSON.stringify({composition:t.composition,hash:t.hash}),headers:{"Content-Type":"application/json"}}),s=await o.json();if(!o.ok)throw new Error("Error reading enhanced composition");return s.composition},Le=({composition:e,enhance:t=o=>o.composition})=>{let o=ie(e);x([()=>e,o],()=>{e._id!==o.value._id&&(o.value=e)},{immediate:!0});let s=ae(()=>{var n;return N()?ne({broadcastTo:[(n=window.opener)!=null?n:window.top],listenTo:[window]}):void 0});return x([s,()=>t],()=>{if(!s.value)return;let r=s.value.on("update-composition",async n=>{if(re(n)){let p=await t(n);o.value=p}});return()=>{r()}},{immediate:!0}),pe(()=>{if(!N()||document.getElementById(g))return;let n=document.createElement("script");n.id=g,n.src=me(),n.async=!0,document.head.appendChild(n)}),{composition:o}};function me(){return`${window.document.referrer}files/canvas-in-context-embed/index.js`}function N(){if(typeof window=="undefined")return!1;let e=new URLSearchParams(window.location.search).has(se),t=Boolean(window.document.referrer.match(/(^https:\/\/|\.)(uniform.app|uniform.wtf|localhost:\d{4})\//));return e&&t}export{h as CANVAS_COMPOSITION_TYPE,P as CANVAS_SLOT_CONTENT_TYPE,b as Composition,xe as DefaultNotImplementedComponent,be as SlotContent,y as compositionInjectionKey,E as convertComponentToProps,Me as createApiEnhancer,v as resolveRendererInjectionKey,Oe as useCompositionEventEffect,Le as useCompositionInstance};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/canvas-vue",
-  "version": "17.5.0",
+  "version": "17.5.1-alpha.7+ab97e4ba9",
   "description": "Vue SDK for Uniform Canvas",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -22,12 +22,12 @@
     "format": "prettier --write \"src/**/*.{js,ts,tsx}\""
   },
   "dependencies": {
-    "@uniformdev/canvas": "^17.5.0",
+    "@uniformdev/canvas": "^17.5.1-alpha.7+ab97e4ba9",
     "@vue/test-utils": "2.2.1",
-    "vue-demi": "^0.13.0"
+    "vue-demi": "^0.13.11"
   },
   "peerDependencies": {
-    "@uniformdev/context-vue": "^17.5.0",
+    "@uniformdev/context-vue": ">=17.5.0",
     "@vue/composition-api": "^1.0.0-rc.1",
     "vue": "^2.0.0 || >=3.0.0"
   },
@@ -39,9 +39,9 @@
   "devDependencies": {
     "@testing-library/vue": "6.6.1",
     "@types/uuid": "8.3.4",
-    "@uniformdev/context-vue": "^17.5.0",
+    "@uniformdev/context-vue": "^17.5.1-alpha.7+ab97e4ba9",
     "@vue/server-test-utils": "1.3.0",
-    "vue": "3.2.37",
+    "vue": "3.2.45",
     "vue-server-renderer": "2.7.13",
     "vue-template-compiler": "2.7.13"
   },
@@ -62,5 +62,5 @@
     "last 2 versions",
     "not dead"
   ],
-  "gitHead": "de1f52defe798010336e1dd3b2732fce359855fb"
+  "gitHead": "ab97e4ba97e3842e6c7f208c4c96be3f9f74337e"
 }